javascript - 为什么不能按正序删除样式？

Question

我修改了下面 SO 帖子中的问题/答案，以删除样式，按正序排列。

问题/答案以相反的顺序删除脚本。

那没起效。但是，如果我将其改回逆序，则一切正常。

我的猜测是，如果您删除style[0]，style[1]它将立即更新为样式 [0]，在示例中只有两种样式。因此循环会失败。

这个对吗？

样式数组是否在修改时几乎立即更新？

var scripts  = document.getElementsByTagName("script");
for (var i=scripts.length; i--; ){
   (scripts[i]).parentNode.removeChild(scripts[i]);
}

score 2 · Accepted Answer

你的猜测是正确的；getElementsByTagName返回一个实时的“数组”（它实际上不是一个数组，而是一个NodeListor HTMLCollection，取决于浏览器和版本），它反映了对 DOM 的后续更新。

所以，你可以写：

var styles = document.getElementsByTagName("style");
while (styles.length) {
    styles[0].parentNode.removeChild(styles[0]);
}

也就是说，没有理由更喜欢这种方式。由于 JavaScript 在绘制 UI 的同一线程中运行，删除样式的结果要等到循环完成后才会生效，因此顺序对您来说并不重要。

有用的 MDN 链接：

score 1 · Accepted Answer

elements 是按它们在子树中出现的顺序找到的元素的活动 NodeList（但请参见下面的注释）。如果未找到任何元素，则 NodeList 为空。

因此，一旦您删除元素 [0]，元素 [0] 就会被元素 [1] 填充，从而删除元素 [1]（除非有元素 [2]）。

您可以像这样以“正常”顺序执行此操作（尽管由于对 scripts.length 的重复测试，它的性能不高）：

var scripts  = document.getElementsByTagName("script");
while (scripts.length) {
    (scripts[0]).parentNode.removeChild(scripts[0]);
}

2 回答 2