Question

我有一个像这样的html表：

 <table>
   <tr id='first'>
      <td>text</td>
   </tr>
   <tr>
      <td>text</td>
   </tr>
   <tr>
      <td>text</td>
   </tr>     
 </table>

我想一次删除2个tr元素：

 <script>
    var tr = document.getElementById('first'),
        table = document.getElementsByTagName('table')[0],
        i=0;

    do {
      tr = table.tbody.removeChild(tr);
    } while ((tr = tr.nextSibling(tr)) && i++<2);
 </script>

但是在第一次迭代后table.removeChild(tr)返回null，所以我无法得到tr.nextSibling(tr)。

请帮帮我。

Answer 1

也许你应该在删除当前的tr之前定义要移除的下一个tr。

Answer 2

您应该临时保存对下一行的引用，如下所示。另外，要选择tbody，您必须使用tBodies[0]。

var nextrow = document.getElementById('first'),
    table = document.getElementsByTagName('table')[0],
    i=0, tr;
while (nextrow && i++<2) {
  tr = nextrow;
  nextrow = tr.nextSibling;
  table.tbodies[0].removeChild(tr);
}

另一种通用解决方案：

var nextrow = document.getElementById('first'),
    i=0, tr;
while (nextrow && i++<2) {
  tr = nextrow;
  nextrow = tr.nextSibling;
  tr.parentNode.removeChild(tr);
}

Answer 3

这也有效：

    var trs = document.getElementsByTagName("tr");
    for(var i = 1; i < trs.length; i++){
        trs[i].parentNode.removeChild(trs[i]);
        i--;
    }

如何删除两个tr元素？

3 个答案: