Question

我在使用javascript中的函数时遇到问题，无法找出原因。这真的很直接。我正在尝试删除html表中的所有行。所以我写道：

function delete_gameboard(){
   var table = document.getElementById("gameboard");
   var rowCount = table.rows.length;
   for (var i = 0; i < rowCount; i++) {
      table.deleteRow(i);
   }
}

然而，它只会删除其中的一半。任何人都能看到导致这种奇怪行为的原因吗？

Answer 1

因为当你删除第一行时，第二行将成为第一行，它是动态的。

你可以这样做：

while(table.rows.length > 0) {
  table.deleteRow(0);
}

Answer 2

考虑一下：

index 0:  row #1
index 1:  row #2
index 2:  row #3
index 3:  row #4
index 4:  row #5

删除索引＃2（第3行），因此DOM引擎会调整索引键，最后会得到：

index 0:  row #1
index 1:  row #2
index 2:  row #4   <---hey! index #2 is still there
index 3:  row #5

你基本上是在你所站立的地方挖一个洞，所以当你深入挖掘时，你会自然地沉入更深的地方，从未看到任何进展......直到你在表格中删除了用完的行。< / p>

Answer 3

如果删除第一行，则第二行将成为新的第一行。

我更喜欢这样做：

while(table.rows[0]) table.deleteRow(0);

Answer 4

function delete_gameboard(){
var table = document.getElementById("gameboard");
var rowCount = table.rows.length;
for (var i=rowcount-1; i >=0; i--) {
    table.deleteRow(i);
}
}

删除时，行的索引会发生变化。使用反向循环。如果您使用任何条件删除行，这也会有所帮助。如果要删除所有行，请使用以下

while(table.rows.length) {
  table.deleteRow(0);
}

Answer 5

table行是活动的，即如果删除第0行，则下一行变为第0行，只是不断删除第0行

function delete_gameboard(){
    var table = document.getElementById("gameboard");
    var rowCount = table.rows.length;
    for (var i=0; i < rowCount; i++) {
        table.deleteRow(0);
    }
}

Answer 6

function delRow()
  {
    var current = window.event.srcElement;
    //here we will delete the line
    while ( (current = current.parentElement)  && current.tagName !="TR");
    current.parentElement.removeChild(current);
  }

Answer 7

你可以去：

    document.getElementById("gameboard").innerHTML = "";

Answer 8

如果您在代码中使用JQuery，那么删除行的最简单方法是使用以下代码：

$('#myTable tbody').html('');

在javascript中删除表行

8 个答案: