Körperfresser

Seit ein paar Tagen arbeite ich mich durch dieses Buch (ich bekomme für den Hinweis kein Geld, nur falls jemand jetzt nachfragt) sehr empfehlenswerte Buch zum Thema AJAX. Die ersten Erfolge haben sich auch schon eingestellt und ich hoffe, das neue Plugin in Kürze ins Licht der Öffentlichkeit scheuchen zu können – nichts weltbewegendes, aber für mich ganz brauchbar.

Wie ich feststellen konnte, ist das Hinzufügen von neunen Elementen mittels JavaScript und DOM relativ einfach. Die Möglichkeiten von appendChild() eröffnen ganz neue Wege. Es gibt aber Fälle, da bietet es sich an, ein neues Element nicht an das letzte anzuhängen, sondern vor einem ganz bestimmten Element einzufügen. Dafür gibt es den Befehl insertBefore(), der genau das leistet. Zumindest in der Theorie und in den einfachen Beispielen aus dem Buch.

Daher erschien es mit auch völlig problemlos, mein bisheriges Skript so abzuändern, dass eine neue Tabellenzeile vor der letzten Zeile der Tabelle eingefügt wird. Aber es ging nicht. Immer wieder bekam ich eine Fehlermeldung, dass der Knoten nicht gefunden worden sei. Ich war mir ziemlich sicher, alles richtig gemacht zu haben. Die Syntax des Befehls ist dabei wie folgt:

eltern_element = insertBefore(neues_element, schwester_element);

In meinem Fall war das Schwesterelement die letzte Tabellenzeile und das Elternelement die Tabelle selber. Letzteres ist aber leider falsch, denn seit HTML 4.0 sieht die DOM-Struktur einer Tabelle etwas anders aus:

<table>
<thead>...</thead>
<tbod>...</tbod>
<tfoot>...</tfoot>
</table>

Dabei ist thead der Tabellenkopf, tbody der eigentliche Tabellenteil und tfoot der Fuß einer Tabelle.

Soweit, so gut. Ich hatte aber eine „klassische” Tabelle verwendet. Das war den Browsern allerdings egal, da sie anscheinend von selber ein tbody-Knoten im DOM-Baum hinzufügen, wenn das Element nicht im Quelltext steht.

Für mein JavaScript bedeutete das, dass der table-Knoten eben nicht das von mir vermutete Elternelement der Tabellenreihe war. Nach dem ich im Quelltext explizit den tbody-Tag gesetzt hatte und diesem dann die bisherige ID der Tabelle verpasste, lief alles so, wie ich mir das von Anfang an vorgestellt hatte.

Eine schwere Geburt, aber wieder was dazu gelernt.

Kommentar verfassen