javascript - 删除 div 节点的子节点

Question

我有以下代码来删除 div 节点的子节点。这两个代码都正确吗？

while(innerWindowContentBox.hasChildNodes())     
innerWindowContentBox.removeChild(innerWindowContentBox.childNodes[0]);

其他是

innerWindowContentBox.innerHTML = '';

请注意，该代码用于 Greasemonkey 脚本，因此不需要 IE 支持。

Answer 1

这两段代码都可以完成工作，但使用 DOM 方法(即 while(innerWindowContentBox.hasChildNodes() ...)。

优点:

1. 速度快了很多。 参见this speed comparison at jsperf.com . 在示例 HTML(数百个节点，每个节点都有事件处理程序)上，DOM 方法的速度提高了 10 到 20 倍(到目前为止)。

2. 避免坏习惯。乱用 innerHTML 会导致意想不到的错误，尤其是在需要广泛浏览器支持的代码上。至少，它会破坏您可能想要保留的事件处理程序。对于这种特殊情况，这不是问题，但如果您养成 innerHTML 操作的习惯，它会在某些时候困扰您。

3. DOM 方法可以像外科手术一样只改变您需要的部分，而 innerHTML 会破坏所有子节点，迫使浏览器重建您希望保留的任何内容。

   <