javascript - 为什么只删除双循环内的偶数/奇数子代

Question

让我们考虑以下代码

var ULs = document.getElementsByTagName('ul');
for(var i = 0; i < ULs.length; i++) {
	var ulLIs = ULs[i].getElementsByTagName('li');
	for(var n = 0; n < ulLIs.length; n++) {
		ulLIs[n].parentNode.removeChild(ulLIs[n]);
	}
}

<ul>
	<li>1-1</li>
	<li>1-2</li>
	<li>1-3</li>
	<li>1-4</li>
</ul>
<ul>
	<li>2-1</li>
	<li>2-2</li>
	<li>2-3</li>
	<li>2-4</li>
</ul>

如您所见，JavaScript 仅删除偶数或奇数子级。但我需要删除所有的 child 。

我该怎么做？

Answer 1

当您删除内部循环中的一个元素时，ulLIs 列表中其后继的索引会减一，特别是下一个要访问和删除的项目的索引。因此它是由当前索引n引用的。但对于下一次迭代，该索引会增加。

通过倒数来避免此问题:

for (var n = ulLIs.length-1; n >= 0; n--) {
    ulLIs[n].parentNode.removeChild(ulLIs[n]);
} 

This SO answer通过重新设置列表容器的innerHtml或重复删除第一个子节点直到没有为止，提供了两种更好的解决方案。