Unsichtbare HTML-Tabellen

Ich will mit JavaScript dynamisch eine Tabelle in einer Webseite erzeugen. Das klappt mit allen Browsern - nur mit dem Internet Explorer nicht.

Um per JavaScript eine Tabelle auf einer Webseite einzubinden, muss man die Elemente für Tabelle (<table></table>), Zeile (<table><tr></tr></table>) und Zelle (<table><tr><td></td></tr></table>) zuerst mit var tabelle = document.createElement(‚table’) et cetera erzeugen; anschließend baut man sie mit appendChild()-Anweisungen wie tabelle.appendChild(zeile) zusammen und hängt sie in den Dokumentbaum ein.

Internet Explorer führt diese Anweisungen klaglos aus, zeigt aber keine Inhalte der Tabelle an. Einen Hinweis auf die Lösung gibt ein Blick in einen DOM-Inspektor, wie er in Firefox eingebaut ist oder sich für den Internet Explorer über die IE Developer Toolbar nachrüsten lässt: Im Dokumentbaum schieben nämlich beide Browser in eine HTML-Tabelle ungefragt ein -Element zwischen <table></table> und das erste <table><tr></tr></table> ein. Dieses selten verwendete Element definiert explizit den Tabellenkörper.

Im Dokumentbaum ist Voraussetzung dafür, dass der Browser den Inhalt einer Tabelle anzeigt. Offenbar kann der Internet Explorer bei einer dynamisch generierten Tabelle dieses Element jedoch nicht automatisch einfügen. Daher muss das Skript dieses Element mit document.createElement(‚tbody’) explizit erzeugen und als Kind des Tabellenelements einhängen.

Soft-Link (heb)