Was ist der Unterschied zwischen window.location und document.location in JavaScript?

Antworten:

220

Laut W3C sind sie gleich. In Wirklichkeit sollten Sie aus Gründen der browserübergreifenden Sicherheit window.locationeher als verwenden document.location.

Siehe: http://www.w3.org/TR/html/browsers.html#dom-location

rahul
quelle
12
Abgestimmt. Antworte widersprüchlich. Es sagt kühn, dass sie gleich sind, und beschreibt dann die Unterschiede im helleren Text. Sie sind definitiv nicht gleich.
Danorton
33
Komm schon, Trigger-Happy Down-Wähler, mach ein bisschen heller. Zum größten Teil verhalten sie sich ähnlich, wenn man die von Rahul spezifizierte Höhle betrachtet. Lassen Sie uns ihn nicht auf Semantik treffen. Ein bisschen Philadelphia, meine Herren. Zum einen fand ich seine Antwort völlig zufriedenstellend. +1 (Christophs sollte die akzeptierte Antwort sein, aber Rahuls ist akzeptabel - zumindest nicht wert, herabgestimmt zu werden.)
cssyphus
7
-1 für die Empfehlung einer Best Practice (immer verwendet window.location) ohne Begründung. Wenn Sie die Begründung nicht liefern, warum sollte jemand Ihren Rat befolgen? Christophs Antwort ist in dieser Hinsicht weitaus nützlicher.
Mark Amery
+1, aber siehe auch die Antworten von Phil Hamer und Christoph unten. Sie fügen wichtige Hintergrundinformationen und Vorbehalte hinzu, um das Problem vollständig zu verstehen.
Jon z
Eigentlich bemerke ich einen Unterschied zwischen beiden. Wenn Sie beispielsweise von einem untergeordneten Frame aus zu einem Sandbox-Frame navigieren möchten, können Sie dies nur mit document.location tun, nicht jedoch mit window.location
M.Abulsoud,
207

Der kanonische Weg, um das aktuelle Standortobjekt abzurufen, ist window.location(siehe diese MSDN-Seite von 1996 und den W3C-Entwurf von 2006 ).

Vergleichen Sie dies mit document.location, das ursprünglich nur die aktuelle URL als Zeichenfolge zurückgegeben hat (siehe diese Seite auf MSDN ). Wahrscheinlich, um Verwirrung zu vermeiden, document.locationwurde durch document.URL(siehe hier auf MSDN ) ersetzt, das ebenfalls Teil von DOM Level 1 ist .

Soweit ich weiß, Karte alle modernen Browser document.locationzu window.location, aber ich immer noch lieber window.locationals das ist , was ich verwendet habe , seit ich meinen ersten DHTML geschrieben.

Christoph
quelle
1
Wenn Sie verwenden window.location, ist es nicht gleichermaßen gültig, nur zu verwenden location?
Commonpike
2
@commonpike Es ist - im Kontext eines Skripts in [mindestens] einem HTML-Dokument ist das globale Objekt, in dem alle definierten Variablen zu Eigenschaften werden, das windowObjekt. Daher ist jede Variable oder Funktion, die Sie auf der obersten Ebene Ihres Skripts definieren, eine Eigenschaft des Objekts, auf das verwiesen wird window, das zufällig das globale Objekt ist. Globales Objekt wird impliziert, wenn es abwesend ist window.- also locationals interpretiert window.location. Vorsichtsmaßnahmen - zB if(an_undefined_variable)wird ein Fehler ausgegeben , wenn die Variable nicht definiert wurde - if(window.an_undefined_variable)nicht.
Am
92

window.location wird in allen kompatiblen Browsern gelesen / geschrieben.

document.location ist (zumindest) in Internet Explorer schreibgeschützt, in Gecko-basierten Browsern (Firefox, SeaMonkey) jedoch schreibgeschützt.

Frédéric Hamidi
quelle
10
Ich kann die Behauptung, document.locationdie im IE schreibgeschützt ist, nicht reproduzieren . Ich kann es erfolgreich in IE 10, 9, 8 und 6 zuweisen (mit VMs von modern.ie ).
Mark Amery
irgendwelche Kommentare zu console.log(location);? !!
Fr0zenFyr
44

document.locationwar ursprünglich eine schreibgeschützte Eigenschaft, obwohl Sie sie auch in Gecko-Browsern zuweisen können. Verwenden Sie window.locationstattdessen für die browserübergreifende Sicherheit .

Weiterlesen:

document.location

window.location

diEcho
quelle
Ich kann keine klare Antwort finden, wann ich eine von ihnen verwenden soll. Schauen Sie sich meine Antwort unten an
M.Abulsoud
37

Interessanterweise enthält 'document.location', wenn Sie einen Rahmen, ein Bild oder ein Formular mit dem Namen 'location' haben, anstelle des Location-Objekts einen Verweis auf das Rahmenfenster, das Bild bzw. das Formular. Dies liegt anscheinend daran, dass die Suche nach den Auflistungsnamen document.forms, document.images und window.frames Vorrang vor der Zuordnung zu window.location hat.

<img name='location' src='location.png'>

if (document.location.tagName == 'IMG') alert('Hello!')
Phil Hamer
quelle
2
Es gibt keine Priorität, es wird einfach überschrieben
Pacerier
7
Nein, es wird nicht überschrieben. Es ist im Schatten, also hat Phil Recht damit, dass Elemente bei der Auflösung von Eigenschaften Vorrang haben.
Kangax
@ Kangax, Scheint, als hättest du recht: jsfiddle.net/uL4ysszr . Aber wie zuverlässig ist dieses Verhalten? Ist es ausreichend browserübergreifend?
Pacerier
1
Gerade getestet (Oktober 2016). Es scheint, dass window.locationund document.locationkann nicht in Chrome oder Firefox beschattet werden.
Mr. Llama
1
@ Mr.Llama Du hast recht. Es scheint, dass sich alle modernen Browser nicht mehr so ​​verhalten, wie ich es oben beschrieben habe. Dies scheint darauf zurückzuführen zu sein, dass document.location das Attribut "Unforgeable" zugewiesen wurde. Relevante Chrom-Änderung: src.chromium.org/viewvc/blink?view=revision&revision=189862 Und Firefox-Fehler: bugzilla.mozilla.org/show_bug.cgi?id=1133760
Phil Hamer
27

Soweit ich weiß, sind beide gleich. Für die browserübergreifende Sicherheit können Sie window.locationeher als verwenden document.location.

Alle modernen Browser Karte document.locationzu window.location, aber ich immer noch lieber window.locationals das ist , was ich verwendet habe , seit ich meine erste Web - Seite geschrieben. es ist konsequenter.

Sie können auch document.location === window.locationRückgaben sehen true, die verdeutlichen, dass beide gleich sind.

Alphamännchen
quelle
14

document.location === window.location kehrt zurück true

ebenfalls

document.location.constructor === window.location.constructor ist true

Hinweis: Gerade getestet auf Firefox 3.6, Opera 10 und IE6

SIE
quelle
1
@ Pacerier Warum? Für Objekte ===und ==sind gleichwertig.
Mark Amery
4
@ MarkAmery, das ist falsch und kann leicht demonstriert werden: "abc" == new String("abc")Rückkehr truewährend "abc" === new String("abc")Rückkehr false.
Pacerier
7
@Pacerier Okay, lassen Sie mich das etwas strenger und weniger mehrdeutig sagen: Wenn Sie zwei Objekte miteinander vergleichen (und nicht nur ein Objekt mit irgendetwas) ==und ===gleichwertig sind. Siehe die Spezifikationsabschnitte 11.9.3 und 11.9.6. Für Nicht-Null-, Nicht-Undefinierte, Nicht- ==Zahlen- , Nicht-Bool-, Nicht-String-Werte mit demselben Typ wird das Verhalten von 11.9.3 Teil 1f und das ===Verhalten von 11.9.6 Teil 7 bestimmt, die identisch Return trueiffalse
Mark Amery
10
@ MarkAmery, Es gibt keine Garantie dafür, dass beide document.locationund window.locationauf Objekte zeigen. Sie vermissen den ganzen Punkt von Triple Equals; Die Verwendung von 2 gleich beweist nicht, dass sie dasselbe Objekt sind. Wir sollten 3 gleiche und nicht 2 gleiche verwenden, da 2 gleiche uns ein falsches Positiv geben. In einem Browser, in dem document.location eine URL-Zeichenfolge ist, die gleich true ist window.location.toString(), document.location==window.locationwird true zurückgegeben, während document.location===window.locationfalse zurückgegeben wird.
Pacerier
@ Pacerier Aha - ich verstehe es endlich. Sie sind ganz richtig, zumindest was den document.location === window.locationVergleich betrifft. Die Tatsache, dass der .constructorVergleich ebenfalls eingeworfen wird, bedeutet meiner Meinung nach, dass diese Antwort immer noch richtig ist, aber die Verwendung ===würde die Argumentation vereinfachen.
Mark Amery
11

Ja, sie sind gleich. Dies ist eine der vielen historischen Macken in der JS-API des Browsers. Versuchen Sie Folgendes:

window.location === document.location
Matthew Flaschen
quelle
8

window.location ist unter Berücksichtigung älterer Browser die zuverlässigere konsistente der beiden.

Dave Ward
quelle
3

Es ist heutzutage selten, den Unterschied zu sehen, da HTML 5 keine Framesets mehr unterstützt. Zu der Zeit, als wir ein Frameset hatten, leitete document.location nur den Frame um, in dem Code ausgeführt wird, und window.location leitete die gesamte Seite um.

Marquinho Peli
quelle
2

Ich würde sagen, window.locationist der zuverlässigere Weg, um die aktuelle URL zu erhalten . Das Folgende ist der Unterschied zwischen dem window.locationund dem document.url, der in einem der Szenarien, in denen ich Hash-Parameter in die URL angehängt und später gelesen habe, vorgekommen ist.

Nach dem Hinzufügen von Hash-Parametern in der URL.

In einem älteren Browser konnte ich die Hash-Parameter nicht mithilfe von aus der URL abrufen document.url, aber als ich sie verwendete, window.locationkonnte ich die Hash-Parameter über die URL abrufen.

Es ist also immer besser zu benutzen window.location.

azhar_salati
quelle
1
-1. Die Frage erwähnte nicht einmal document.URL- es ging um window.locationund document.location. Existiert document.urlauch nicht = es sollte in Großbuchstaben geschrieben werden.
Mark Amery
2

document.location.constructor === window.location.constructorist true.

Es ist, weil es genau das gleiche Objekt ist, von dem Sie sehen können document.location===window.location.

Es ist also nicht erforderlich, den Konstruktor oder eine andere Eigenschaft zu vergleichen.

Gene Karasev
quelle
2

Zumindest im IE gibt es einen kleinen Unterschied zur lokalen Datei:

document.URL gibt "file: // C: \ projects \ abc \ a.html" zurück.

window.location.href gibt jedoch "file: /// C: /projects/abc/a.html" zurück.

Einer ist ein Schrägstrich, einer ist ein Schrägstrich.

Justin
quelle
2

Nun ja, sie sind die gleichen, aber ...!

window.location funktioniert in einigen Internet Explorer-Browsern nicht.

divHelper11
quelle
0

Obwohl die meisten Leute hier empfehlen, sah das dynamische Protokoll von Google Analytics so lange aus (bevor sie kürzlich von ga.js zu analyse.js wechselten):

ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';

Weitere Informationen: https://developers.google.com/analytics/devguides/collection/gajs/

In der neuen Version wurde '//' verwendet, damit der Browser automatisch das Protokoll hinzufügen kann:

'//www.google-analytics.com/analytics.js'

Wenn Google document.location dem window.locationProtokoll in JS vorzieht , haben sie vermutlich einige Gründe dafür.

GESAMT : Ich persönlich glaube das document.locationund bin window.locationdas gleiche, aber wenn Riese mit den größten Statistiken über die Verwendung von Browsern wie Google mit document.location , empfehle ich, ihnen zu folgen.

Kainax
quelle
2
Ich habe jedoch nicht abgelehnt, es könnte sein, dass dies eine wirklich alte Frage ist und Ihre Antwort keine neuen oder wertvollen Beweise dafür liefert, dass eine besser ist als die andere. Oder es könnte sein, dass Ihre Antwort das Gegenteil der öffentlichen Meinung suggeriert, unabhängig davon, welchen Verdienst Sie dem geben, was Google in der Vergangenheit getan hat. Oder es könnte sein, dass dem Downvoter einfach nicht gefallen hat, wie Sie Teile Ihrer Antwort hervorheben, die nicht wirklich hervorgehoben werden müssen. Könnte wirklich alles sein. Das ist das Schöne an der anonymen Abstimmung über SO.
M.Babcock
0

Tatsächlich bemerke ich einen Unterschied in Chrome zwischen beiden. Wenn Sie beispielsweise von einem untergeordneten Frame aus zu einem Sandbox-Frame navigieren möchten, können Sie dies nur mit document.location, nicht jedoch mit window.location tun

M.Abulsoud
quelle