javascript - 如何使用类删除元素

Question

单击具有相同类“框”的按钮时，我想删除所有元素。我已经查找了几个人们这样做的示例，但我仍然无法弄清楚如何为我的代码执行此操作。

我有这个功能，它在单击按钮时向 DOM 添加一个框。

 function addBox(newbox) {                                   
   var scene = document.getElementById("scene"); //where all new divs will go        
   var div = document.createElement("div");                   
   div.className += " " + "box";            // assigns the class "box" to all divs
   div.innerHTML += newbox.name; 
   div.style.backgroundColor = newbox.color;                            
   scene.appendChild(div);                                    
  }

这是我正在尝试在单击不同按钮时清除所有新 div 的功能。

  function clear() {
  var elems = document.getElementsByClassName("box");
  for ( k = elems.length - 1; k >= 0; k--) {
   parentElement.removeChild(elems[k]);
  }
  }

我在控制台中收到的警告是“未定义 parentElement”。我一直在试图弄清楚如何定义父元素，但我遇到了麻烦。任何帮助表示赞赏。谢谢

Answer 1

您可以从元素的parentNode属性中获取父级：

function clear() {
    var elems = document.getElementsByClassName("box");
    for (var k = elems.length - 1; k >= 0; k--) {
        var parent = elems[k].parentNode;
        parent.removeChild(elems[k]);
    }
}