javascript - 动态移除之前动态添加的div

Question

我编写了一个函数来将 div 动态插入到网页中。但后来我必须删除这些 div。在添加 div 时，我对所有 div 使用了类名。因此，我使用 getElementsByClassName() 从 dom 中获取所有元素，并遍历所有这些元素并删除 div。我的代码没有删除之前创建的所有 div。

请找到我的代码片段：

var elements = document.getElementsByClassName("xxxx");

for (var i = 0; i < elements .length; i++) {

  var element = elements[i];

  if (element && element.hasChildNodes()) {

      var parent_node = element.parentNode;

      while(element.firstChild) {

          parent_node.insertBefore(element.firstChild, element);
      }

      parent_node.removeChild(element);

   }

   elements = document.getElementsByClassName("xxxx");

 }

Answer 1

如果您只想删除该类的所有 DIV 元素，则可以使用以下代码：

var elements = document.getElementsByClassName("xxxx");
while ( elements[0] ) {
    elements[0].parentNode.removeChild(elements[0]);
}

它还将删除您的 DIV 及其子节点。

Answer 2

您需要删除最后一行“elements = document.getElementsByClassName("xxxx");” - 那条线会导致你在循环中错过所有其他元素。