Javascript 按类名删除元素

Question

我们如何删除具有相同类名的所有 div。

 <input class="form-control" type="text" name="option[]"><input class="form-control" type="text" name="option[]"><input class="form-control" type="text" name="option[]">

Answer 1

尝试使用querySelectorAll()和NodeList#forEach来迭代元素

document.querySelectorAll('.classname').forEach(function(a){
a.remove()
})

示例片段

 document.querySelectorAll('.form-control').forEach(function(a) { a.remove() })

 <input class="form-control" type="text" name="option[]"> <input class="form-control" type="text" name="option[]"> <input class="form" type="text" name="option[]" value="not same class"> <input class="form-control" type="text" name="option[]">

Answer 2

我的方法可能是这样

var elements = document.querySelectorAll('.test');  
for (var element of elements) {
   element.remove();
   // or 
   // element.parentNode.removeChild(element);
}

希望能帮助到你。

Answer 3

使用 jQuery：

$(".form-control").remove();

没有 jQuery：

var elems = document.querySelectorAll(".form-control");
elems.forEach(function(element) {
  element.parentNode.removeChild(element);
});

Answer 4

您可以使用querySelectorAll和 JavaScript 的箭头函数功能

document.querySelectorAll(".class-name").forEach(el => el.remove())