Question

如果页面上有多个warningmessage元素，则document.getElementsByClassName('warningmessage').remove();不起作用。

如何删除该类的所有元素？我必须使用for each吗？是不是有deleteall（）的命令？

感谢您的提示！

Answer 1

您需要使用循环。以下代码显示了您如何使用“普通”javascript编写。

var elements = document.getElementsByClassName('warningmessage'),
    element;
while (element = elements[0]) {
  element.parentNode.removeChild(element);
}

的 The working demo. 的

Answer 2

使用纯JavaScript，您可以执行此操作：

var nodes = document.getElementsByClassName('warningmessage');
for(var i = 0; i < nodes.length; i++){
  nodes[i].parentNode.removeChild(nodes[i]);
}

所以你首先要获得你感兴趣的节点，然后迭代它们并从父母那里删除它们。

遗憾的是forEach上没有NodeList方法。但是，你可以这样：

var nodes = document.getElementsByClassName('warningmessage');
[].forEach.call(nodes, function (node) {
  node.parentNode.removeChild(node);
});

Answer 3

使用JQuery会更容易：

$('.warningmessage').remove();

但是如果你没有这样做，那就不那么难了。 getElementsByClassName可以返回项目的节点列表。因此，您只需遍历列表并删除每个项目：

var list = document.getElementsByClassName("warningmessage");
for(var i = list.length - 1; i >= 0; i--)
{
    var n = list[i];
    n.parentNode.removeChild(n);
}

Answer 4

你可以试试这个

var elms= document.getElementsByClassName('warningmessage');
while(elms.length>0){
   for(var i = 0; i < elms.length; i++){
      elms[i].parentNode.removeChild(elms[i]);
   }
}

http://jsfiddle.net/gBwjA/

Answer 5

之前我遇到过这个问题，最后我在这个算法中。

function removeElement(target) {
    if(target.hasOwnProperty('length')) {
        for(i=0; i<target.length; i++) {
            removeElement(target[i]);
        }
    } else {
        target.parentNode.removeChild(target);  
    }
}

然后你调用这样的函数：

removeElement(document.getElementById('the-id'));

或者如果要删除HTML元素集合，则以这种方式调用该函数：

removeElement(document.getElementsByTagName('tag-name'));

在多个元素上使用remove（）

5 个答案: