当我加载我的页面时,会创建一个 nodeList,它看起来像这样:
[text, h4, text, span, br, input, br, span, br, input, br, span, br, input, br, span, br, input, br]
我创建了一个简单的 for
循环遍历所有这些元素并从 DOM 中删除每一个元素。 (所有元素都在 <section>
中)
这是循环:
for(element in videoTitlesElement.childNodes){
if(!isNaN(element)){
videoTitlesElement.removeChild(
videoTitlesElement.childNodes[element]);
}
}
但是,在循环结束时,nodeList 看起来像这样:
[h4, span, input, span, input, span, input, span, input]
并非所有元素都被删除。为什么?
谢谢。
最佳答案
两件事。首先,在遍历数字索引时不要使用 for ... in
;使用普通的 for
循环。然后你就不需要 isNaN()
检查,而且它通常更安全。
第二个问题是当你删除一个 child 时,你改变了列表的长度。如果您删除 child 0,那么曾经是 child 1 的 child 会变成 child 0。因此,您真正想要的是一个简单的 while
循环:
while (videoTitlesElement.childNodes.length)
videoTitlesElement.removeChild(videoTitlesElement.childNodes[0]);
或者,更简单:
while (videoTitlesElement.firstChild)
videoTitlesElement.removeChild(videoTitlesElement.firstChild);
我还应该注意(假设您正在使用 HTML DOM)通过简单地通过 .innerHTML
来清除元素的所有子节点会更容易:
videoTitlesElement.innerHTML = "";
关于javascript - for...in 循环不遍历所有属性?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32784922/