Christian S.: Problem mit JS Code / DOM / dynamisches Füllen einer tabelle

Beitrag lesen

Hi,

habe ein kleines Problem mit folgendem JS-Code:

function Test(e)
{
    var table = document.getElementById("test");

while (table.childNodes[0])
    {
        table.removeChild(table.childNodes[0]);
    }

var tr = document.createElement("tr");
    var th1 = document.createElement("th");
    var th2 = document.createElement("th");
    th1.innerHTML = "Nachname";
    th2.innerHTML = "Vorname";
    tr.appendChild(th1);
    tr.appendChild(th2);
    table.appendChild(tr);
}

[...]

HTML:
<table border="1" id="test" style="background-color: Gray;width:200px; height: 200px;">
</table>

die Funktion wird von einem Event getriggert.

Im Firefox klappts auch fast. Jedoch scheint er bei jedem Funktionsaufruf "mehr" in die tabelle hinzuzufügen.
Also sieht etwa so aus wie leere Zeilen, die er unter die Kopfzeile hinzufügt werden.

Die Tabelle muss nur bei jedem Event mit anderen Daten gefüllt werden. Dazu wollte ich halt jedesmal erst alle Zeilen löschen und dann neu befüllen.

Im IE (7) klappt es übrigens gar nicht. Es wird nicht einmal eine graue Fläche angezeigt.

Gruß
Christian