Was der Internet Explorer alles nicht kann

Microsoft hatte die tolle Idee eine eigene JavaScript Implementierung zu schreiben und ihr den vielsagenden Namen JScript zu geben. JScript basiert wie auch JavaScript auf dem Standard ECMAScript was eigentlich garantieren sollte dass JavaScript in jedem Browser gleich funktioniert. Wie so oft (man erinnere sich nur an die Ungarische Notation (http://de.wikipedia.org/wiki/Ungarische_Notation) die man bei Microsoft völlig mißverstanden hat) gibt es auch bei JScript diverse Punkte die gar nicht oder nur unvöllständig funktionieren.

Bevor Mißverständnisse aufkommen, natürlich kann der Internet Explorer in for-Schleifen Objekte iterieren! Bemerkenswert ist dabei aber dass er dabei in den einzelnen Schleifendurchläufen völlig andere Dinge in dem Objekt findet als, jeder andere Browser!

Codebeispiel:

var oHeaderElement = document.getElementsByTagName('head')[0];

for ( i in oHeaderElement ) { // foreach schleife
alert(i + ': ' + oHeaderElement[i]);
}

Lösung: Die Lösung ist in diesem Fall denkbar einfach. Nutzt man eine for statt einer foreach schleife bekommt man die gewünschten Elemente. Das faszinierende dabei muss nocheinmal erwähnt werden: Wenn ich in JScript ein Objekt mit einer foreach-Schleife iteriere, erhalte ich andere Ergebbnisse als mit einer for-Schleife!

Codebeispiel:

var oHeaderElement = document.getElementsByTagName('head')[0];

for ( i = 0; i < oHeaderElement[i].length; i++ ) { // for schleife
alert(i + ': ' + oHeaderElement[i]);
}

P.S. Ich habe dieverse Erklärungen von diversen Microsoft Consultants für dieses Verhalten bekommen, die sich alle irgendie auf den Objekt-Iterator bezogen. Aber für mich in keinem Fall logisch nachvollziebar waren, denn warum sollte sich der Objekt-Iterator bei unterschiedlichen Schleifen unterschiedlich verhalten?

Alle modernen Browser beherrschen Ajax, alle modernen Browser nutzen dafür das XMLHTTPRequest Objekt. Alle? Nein, nicht alle! Ein kleiner blauer Browser aus Redmond wehrt sich nach wie vor tapfer gegen das XMLHTTPRequest Objekt. Der Internet Explorer bzw. JScript kennt kein XMLHTTPRequest Objekt obwohl dieses Bestandteil von ECMAScript (http://www.w3.org/TR/XMLHttpRequest/) ist. Stattdessen gibt es im Internet Explorer ein ActiveX Plugin über das Ajax Requests realisiert werden. Dieses ActiveX Plugin wird von IE Version zu IE Version immer mal wieder ausgetauscht. Die Folge davon ist, dass der einzige Grund für Browserweichen heutzutage nicht mehr die unterschiedlichen Browser sondern eigentlich nur noch die unterschiedlichen IE Versionen (weshalb ich Browserweichen im weiteren nur noch IE Versionsweichen nennen werde) sind. Folgender gruseliger Code ist demnach für das Erstellen eines Ajax Requests notwendig.

Codebeispiel:

var toRequest;
try {
// versuch ein klassischen Ajax Objekt zu erzeugen
oRequest = new XMLHttpRequest();
} catch ( error ) {
try {
// falls dies nicht gelingt muss es sich um einen IE handeln, und wir müssen das entsprechende ActiveXObjekt ansprechen
oRequest = new ActiveXObject("Microsoft.XMLHTTP"); // IE 5
} catch ( error ) {
try {
oRequest = new ActiveXObject("MSXML2.XMLHTTP"); // IE 6
} catch ( error ) {
return false; // wenn auch das nicht möglich ist, geht kein Ajax
}
}
}

Ein weiteres ärgerliches Problem ist das sog. XHR Streaming, auch bekannt unter HTTP Streaming oder Comet Implementierung. Dabei geht es darum einen XMLHTTPRequest dauerhaft offen zu halten und in einem Stream immer wieder Nachrichten an den Client zu schicken. Ein möglicher Anwendungsfall für solch eine Lösung währen beispielsweise Chatanwendungen. Da es sich im Internet Explorer um eine Microsoft eigene Interpretation von JavaScript handelt funktioniert auch hier natürlich nicht alles wie in der restlichen Browserwelt. Microsofts XMLHTTP Request ist nicht in der Lage aus einem laufenden Request (Stream) bereits Daten herauszulesen, er kann dies erst nachdem der Request abgeschlossen ist. Zugegeben damit setzt Microsoft sogar den Standard korrekt um, allerdings zusammen mit Opera (von deren Mitarbeitern die RFC´s für den Standard stammen) als einzige auf diese Art und Weise. Alle anderen Browser unterstützen diese Funktionalität trotz des Standars über dessen Sinn sich streiten lässt.

P.S. Also mindestens im IE 9 werden richtige XMLHTTPRequests gemacht statt irgendwelche ActiveX Plugins zu benutzen. Das ändert aber nichts am grundsätzlichen Verhalten und führt dazu dass zusätzlich zu der IE5, IE6, IE7 und IE8 Versionsweiche auch noch eine IE9 Versionsweiche rein muss.

Dieses Problem ist schnell erklärt. Man erzeuge eine JavaScript Funktion und versuche aus einem vererbten Browserfenster darauf zuzugreifen. Nahezu jeder Browser findet die identifiziert die Funktion im Elternfenster als Funktion. Nicht so der Internet Explorer, er identifiziert die Funktion als Objekt!

Codebeispiel:

function testFunction() { }
window.test = testFunction;

// testaufruf im selben browserfenster
alert(typeof window.test); // alle Browser finden eine function

// testaufruf in einem kindfenster
alert(typeof window.opener.test); // IE: object, alle anderen browser: function

Haben sie schonmal versucht im Internet Explorer herauszufinden was für einen Typ ein JavaScript Objekt hat. Nehmen wir mal das XMLHTTPRequest Objekt aus dem Beispiel unter 1.2. in allen Browsern führt folgender Code zu selben Ausgabe:

Codebeispiel:

alert( typeof oRequest); // angezeigt wird immer ein object

Möchte man nun wissen um was für ein Objekt es sich handelt kann man folgendes tun:

Codebeispiel:

alert(oRequest); // IE: object, alle anderen browser: XMLHttpRequest

Was wiederum im allen Browsers gleich funktioniert ist folgender Code:

Codebeispiel:

if ( this.oRequest instanceof XMLHttpRequest ) { // hier ist es auch im IE9 ein XMLHttpRequest Objekt
alert('XMLHttpRequest Objekt'); // in älteren IE versionen ist es vermutlich ein ActiveX Objekt!
}

1.5 document.body, document.documentElement und window

Der Versuch die Abmesungen eines Browserfensters zu ermitteln ist mal wieder ein klassischer Grund für eine IE Versionsweiche:

Codebeispiel:

var browserWidth = null;
var browserHeight = null;

if ( document.body.offsetWidth ) { // diverse ie versionen

browserWidth = document.body.offsetWidth;
browserHeight = document.body.offsetHeight;

} else if ( document.documentElement.offsetWidth ) { // ie6 versionsweiche

browserWidth = document.documentElement.offsetWidth;
browserHeight = document.documentElement.offsetHeight;

} else { // andere browser

browserWidth = window.innerWidth;
browserHeight = window.innerHeight;
}