HTML 查找并停止显示子表

我已经这样做了：

<table id="tabla">
    <tbody>
        <tr><th>row1</th><td>w</td></tr>
        <tr><th>row2</th><td>x</td></tr>
    </tbody>
    <tbody>
        <tr><th>row1</th><td>y</td></tr>
        <tr><th>row2</th><td>z</td></tr>
    </tbody>
</table>

<script type="text/javascript">
    function iterate() {
        var table = document.getElementById("tabla").children;
        for (b=0; b<table.length(); b++) {
            var cells = table[b].children;
            if(cells[0].innerHtml == "row1") {
                if(cells[1].innerHtml == "w") {
                    table[b].style.display="none";
                }
            }
        }
    }
</script>

我的目的是找到表中满足条件的所有子项并停止显示它们。

我的代码不起作用，我不知道为什么。

有人知道吗？

1. 你的孩子们table元素是tbody
2. 没有length()函数，它是一个属性（只需使用length)
3. 没有innerHtml，你应该使用innerHTML
4. The cells[0]你引用的实际上是行（而不是单元格），所以它是innerHTML ==<th>row1</th><td>w</td>

这是对您的代码的修复：

function iterate() {
  var table = document.getElementById("tabla").children;
  for (b=0; b<table.length; b++) {
    var rows = table[b].children;
    for (r=0; r<rows.length;r++) {
      var cells = rows[r].children
      if (cells[0].innerHTML == "row1") {
        if (cells[1].innerHTML == "w") {
          table[b].style.display="none";
        }
      }
    }
  }
}

iterate();

<table id="tabla">
    <tbody>
        <tr><th>row1</th><td>w</td></tr>
        <tr><th>row2</th><td>x</td></tr>
    </tbody>
    <tbody>
        <tr><th>row1</th><td>y</td></tr>
        <tr><th>row2</th><td>z</td></tr>
    </tbody>
</table>