Löschen von Tabellenzeilen in Javascript

Question

Ich habe Probleme mit einer Funktion in Javascript und kann nicht herausfinden, warum. Es ist wirklich ziemlich geradlinig. Ich versuche, alle Zeilen in einer HTML-Tabelle zu löschen. so schrieb ich:

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

Doch es wird nur die Hälfte von ihnen löschen. Kann jemand sehen, was dieses seltsame Verhalten verursacht?

Answer 1

Da Zeile 0, dann die nächste Zeile wird die Zeile 0, löschen, wenn Sie die erste Zeile löschen, wird die zweite Zeile werden das erste ist dynamisch.

Sie könnten wie tun:

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

Answer 2

Die table Reihen ist live, das ist, wenn man nur immer wieder löschen Zeile 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 3

Wenn Sie die erste Zeile löschen, die zweite Reihe die neue erste Reihe wird.

Ich ziehe es, dies zu tun:

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); 
} 
} 

Der Index der Zeile ändert sich, wenn Sie es löschen. Verwenden Sie eine umgekehrte Schleife. Dies ist auch hilfreich, wenn Sie eine Bedingung zum Löschen von Zeilen verwenden. Wenn Sie alle Zeilen löschen, verwenden Sie die folgende

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

Answer 5

diese Bedenken Sie:

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

Sie Index # 2 (Zeile # 3) löschen, so dass die DOM-Engine die Indexschlüssel passt und Sie am Ende mit:

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

Sie sind im Grunde ein Loch an der Stelle zu graben, wo Sie stehen, so wie Sie tiefer graben, natürlich Sie tiefer sinken und nie irgendwelche Fortschritte sehen ... bis Sie aus Reihen laufen zu Löschen Sie in der Tabelle.

Answer 6

Wenn Sie JQuery verwenden in Ihrem Code dann der einfachste Weg, um die Zeilen wird mit dem folgenden Code zu löschen:

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

Answer 7

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 8

Sie könnten einfach gehen:

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