window.location vs. document.location

Tags:

Programmiert man JavaScript für einen Browser, nutzt man ziemlich sicher auch dessen DOM und begegnet so den Objekten window und document. Ersteres repräsentiert das Browserfenster, Letzteres das geladene (DOM-)Dokument. Dass document eigentlich eine Eigenschaft von window ist (window.document) kann man aber getrost ignorieren, da window dem globalen Wertebereich entspricht und window.document deshalb direkt als document verfügbar ist (wie z.B. die window.alert Funktion auch). Als Randnotiz kann man noch anmerken, dass jedes Browsertab ein eigenes window Objekt besitzt.

Manchmal möchte man per JavaScript eine Seite neuladen oder auf eine andere Seite verlinken. Dazu nutzt man normalerweise ein Location Objekt. Doch verwirrenderweise bietet sowohl das window als auch das document Objekt Zugriff auf ein Location Objekt an (jeweils mittels der Eigenschaft location). Doch wo liegen da die Unterschiede? Und welche Variante sollte man nutzen? window.location oder document.location?

Ganz einfach: Das Objekt der Wahl verbirgt sich hinter window.location. Denn document.location war ursprünglich als read-only Eigenschaft gedacht und sollte deshalb (für Schreibzugriffe) nicht verwendet werden. Da die Browserhersteller diesen Missstand erkannt haben, bieten sie nun die document.URL Eigenschaft an, die als String die aktuelle URL repräsentiert und nicht überschrieben werden kann.

Doch wie funktioniert jetzt eigentlich eine korrekte Weiterleitung? Möglichkeiten gibt es ja so einige:

window.location = 'http://bigwhoop.ch';
window.location.href = 'http://bigwhoop.ch';
window.location.assign('http://bigwhoop.ch');
window.location.replace('http://bigwhoop.ch');
window.navigate('http://bigwhoop.ch');

window.navigate('...') vergessen wir gleich wieder. Diese Funktion entspricht keinem Standard und ist ein IE-Ding.

Die ersten drei Möglichkeiten können als gleich betrachtet werden. Die kurze Schreibweise von window.location = '...' ist aber sicherlich zu bevorzugen. Technisch funktioniert das übrigens so, dass das Location Objekt mittels eines Strings überladen werden kann und wenn immer eine Eigenschaft des Location Objektes verändert wird, die Funktionalität von Location.assign() aufgerufen wird.

window.location.replace('...') unterscheidet sich dadurch von den oberen drei Möglichkeiten, dass kein neuer Eintrag in der Browser-History angelegt, sondern der alte überschrieben wird. D.h. der Benutzer kann danach nicht mittels Zurück-Button auf die aktuelle Seite zurückspringen.

Zusammengefasst:

Immer schön window.location = 'http://bigwhoop.ch'; nutzen! :)

Ähnliche Artikel

Kommentare