javascript - 如何使用 innerHTML = = ""删除所有 ；

Question

我的html代码

<ul id = "1">
<li>elti</li>
<li></li>
<li></li>
<li></li>
</ul>

要删除空的 li 我正在使用以下 javascript 代码:

var y = document.getElementById("1");
x = y.getElementsByTagName("li");


for( i = 0; i < x.length ; i++) {
    if (x[i].innerHTML === "" ){
        y.removeChild(x[i]);
        }
}

但是输出是这样的:

<li>elti</li>
<li></li>

如您所见，它不会删除 li 标签。我做错了什么？

Answer 1

反向工作；否则当你删除一个项目时，你会跳过列表中下一个项目的检查:

for( i = x.length - 1; i >= 0; i--) {
  if (x[i].innerHTML === "" ){
    y.removeChild(x[i]);
  }
}

var y = document.getElementById("1");
x = y.getElementsByTagName("li");


for( i = x.length - 1; i >= 0; i--) {
  if (x[i].innerHTML === "" ){
    y.removeChild(x[i]);
  }
}

<ul id = "1">
  <li>elti</li>
  <li></li>
  <li></li>
  <li></li>
</ul>