Javascript按类名删除元素

时间:2017-07-08 09:56:04

标签: javascript dom

我们如何使用同名的类删除所有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[]">

4 个答案:

答案 0 :(得分:6)

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

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

示例摘录

&#13;
&#13;
document.querySelectorAll('.form-control').forEach(function(a) {
  a.remove()
})
&#13;
<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[]">
&#13;
&#13;
&#13;

答案 1 :(得分:1)

我的方法可能是这个

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

希望它有所帮助。

答案 2 :(得分:0)

使用jQuery:

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

没有jQuery:

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

答案 3 :(得分:0)

您可以使用JavaScript的querySelectorAllarrow function功能

const clientConfig = {
    mode: 'production',
    target: 'web',
    devtool: "source-map",
    entry: {
      ...
    },
    module: {
       rules: [
          ...
       ],
    },
    output: {
       ...
    },
    resolve: {
       ...
    } 
}

module.exports = [clientConfig]