V. 8.7 (27.03.2012)

DOM-Manipulation JavaScript - Der Internet Explorer - Namensvergabe

1. Die Abschnitte

2. removeNode

Kommt bitte niemals auf die Idee, eine Funktion zum Löschen von Knoten so zu benennen! Denn dann werdet ihr im IE (6 bis 9) und auch im Opera (bis einschließlich Version 11.0) eine schöne Überraschung erleben. Legt ihr zum Beispiel auf einen Link den folgenden Event-Handler <a href="#" onclick="removeNode()">hauweg</a>, so "verschwindet" der bei einem Klick auf einmal, wird zu "nacktem" Text und nichts passiert. Probiert mal den Basiscode aus.

Die Lösung

removeNode ist wohl wieder mal eine proprietäre Funktion, die Microsoft direkt in seine Browser eingebaut hat (und Opera den Blödsinn übernehmen musste). Daher knallt es an dieser Stelle ganz gewaltig. Wenn man dagegen die Funktion in deleteNode umbenennt, so ist alles wieder feini, feini.

3. Referenznamen

Was ich euch jetzt erzähle, ist der erste "Blindtipp" des Tages. Da ich, wie schon gesagt, im Moment beruflich sehr viel mit komplexer JavaScript-Programmierung zu tun habe, ist mir schon zweimal Folgendes passiert.

Einmal wollt ich eine stinknormale Referenz auf ein HTML-Tag setzen, ein anderes Mal auf ein XML-Tag, das ich mir per Ajax geholt habe. Und in beiden Fällen machte der Internet Explorer schlapp. Das Problem lag darin, dass der Name der Referenzvariable identisch war mit dem des jeweiligen Tags, also in etwa so.


rahmen document.getElementById ('rahmen');
...
ele    ajax_obj.responseXML;
data   ele.getElementsByTagName('data');

Fragt mich bitte nicht

... warum es hier Probleme gab. Ich habe dergleichen schon zigmal gemacht und nie hatte ich Schwierigkeiten damit. Nur in besagten zwei Fällen war auf einmal Hängen im Schacht. Ich habe mich eine halbe Ewigkeit durch den Code gewühlt und danach gesucht, ob ich irgendwo eine Variable überschrieben habe, aber nichts dergleichen. Erst nach dem Umbenennen der Referenzvariablen funktionierte es wieder einwandfrei.

Mein Tipp

Seit diesen traurigen Erlebnissen, die mich viel Zeit gekostet haben, bin ich dazu übergegangen, die Referenzvariablen anders zu benennen, als die entsprechenden Tags, auf die ich zugreifen möchte. Um trotzdem eine gewisse Ähnlichkeit beizubehalten, greife ich persönlich auf eine Verniedlichungsform zurück.


rahmi document.getElementById ('rahmen');
...
ele   ajax_obj.responseXML;
dati  ele.getElementsByTagName('data');

Solltet ihr mal vor einem ähnlichen Phänomen stehen, probiert es einfach mal aus. Gebt bei den Referenzvariablen andere Namen als die zu erfassenden Tags. Vielleicht hilft es. Ob ihr dabei meine "Verniedlichungs"-Variante nehmt, ist völlig lattens und euch überlassen.

weiter zum nächsten Abschnitt