Javascript: Location.href versus Location einstellen

311

Wann würden Sie locationeine URL-Zeichenfolge im Vergleich zur Einstellung festlegen location.href?

location = "http://www.stackoverflow.com";

vs.

location.href = "http://www.stackoverflow.com";

Mozilla Developer-Netzwerkreferenz

javascript chimärisch
quelle
6
Das Festlegen der location.hrefE-Mail schlägt aufgrund der Richtlinie für denselben Ursprung fehl: javascript.info/tutorial/…
Taha Jahangir,
Außerdem replaceund assign: stackoverflow.com/q/1865837/632951 , stackoverflow.com/q/7703689/632951 , stackoverflow.com/q/10302905/632951
Pacerier
1
Ich habe eine Angular 4-App, die TypeScript 2.6.2 verwendet. window.location ist schreibgeschützt und ich kann nur mit window.location.href (im Kontext eines Rückrufs von einem Winkelabonnement) zuweisen, ohne dass Compilerfehler behoben werden - möglicherweise ist dies eine Art JavaScript 1.0-Kompatibilitätssache oder hängt mit der asynchronen Behandlung zusammen . Grundsätzlich scheint window.location.href das einzige zu sein, was immer funktioniert.
Chris Halcrow

Antworten:

261

Sie können locationdirekt einstellen, weil es etwas kürzer ist. Wenn Sie versuchen, knapp zu sein, können Sie dies normalerweise auch weglassen window..

URL-Zuweisungen für beide location.hrefund locationsind so definiert, dass sie in JavaScript 1.0, zurück in Netscape 2, funktionieren. Seitdem wurden sie in jedem Browser implementiert. Treffen Sie also Ihre Wahl und verwenden Sie das, was Sie am klarsten finden.

Bobince
quelle
9
Wie von @SwissMister in der Antwort unten erwähnt, scheint window.location.href wie eine XHR-Anfrage behandelt zu werden. Wenn window.location.href aus dem erfolgreichen Rückruf eines XHR heraus ausgelöst wird, wird es als XHR behandelt, während window.location das Klicken auf einen Link emuliert.
Akshay Raje
147

Selbst wenn beide funktionieren, würde ich letzteres verwenden. locationist ein Objekt, und das Zuweisen einer Zeichenfolge zu einem Objekt ist kein gutes Zeichen für die Lesbarkeit oder Wartung.

Psychotik
quelle
60
Bei der Implementierung einer komplexen PayPal-Integration bin ich auf einen sehr zwingenden Grund für die Verwendung gestoßen window.location: Dies ist nicht erforderlichSAME ORIGIN .
Schweizer Herr
4
Vielleicht bin ich es nur, aber es location = 'http://www.example.com'scheint super lesbar. Allerdings als Sonderfall. Das ist abwärtskompatibel und wird auf absehbare Zeit kompatibel bleiben .
Alex W
10
Wenn window.location ein Objekt wäre, würde das Zuweisen einer Zeichenfolge es mit einer Zeichenfolge überschreiben. Tatsächlich ist window.location eine Eigenschaft mit Getter- und Setter-Methoden. Wenn Sie es festlegen, wird eine Zeichenfolge erwartet und das globale Standortobjekt wird vom Setter aktualisiert. Wenn Sie es erhalten, wird das globale Standortobjekt zurückgegeben.
JukkaP
64

Wie schon gesagt, locationist ein Objekt . Aber diese Person schlug vor, entweder zu verwenden. Sie sollten die .hrefVersion jedoch besser verwenden .

Objekte haben Standardeigenschaften, die angenommen werden, wenn nichts anderes angegeben ist. Im Fall des locationObjekts hat es eine Eigenschaft namens .href. Wenn Sie während der Zuweisung keine Eigenschaft angeben, wird standardmäßig "href" angenommen.

Dies ist alles in Ordnung, bis sich eine spätere Objektmodellversion ändert und entweder keine Standardeigenschaft mehr vorhanden ist oder die Standardeigenschaft geändert wird. Dann bricht Ihr Programm unerwartet ab.

Wenn Sie meinen href, sollten Sie angeben href.

Kirby L. Wallace
quelle
13
Gute Erklärung, besser als nur allgemeine Kommentare zur Lesbarkeit oder Wartung. In der Realität wird in diesem speziellen Fall das Objektmodell nicht geändert, da die Hälfte des Webs anhalten würde - verwenden Sie daher entweder ... es spielt keine Rolle, welcher
Neromancer
71
Das hört sich gut an, ist aber nicht wirklich wahr. Es gibt kein Konzept für eine Standardeigenschaft im DOM oder in JavaScript im Allgemeinen. Das Zuweisen einer Zeichenfolge zu locationfunktioniert, da die Eigenschaft so definiert wurde, dass sie dieses spezielle Zuweisungsverhalten in JavaScript 1.0 aufweist, und seitdem hat jeder Browser dies implementiert. HTML5 benötigt es jetzt. Die Zuweisung .hrefist zwar hübscher oder konsistenter , bietet jedoch keinen Vorteil hinsichtlich der Abwärts- oder Vorwärtskompatibilität.
Bobince
6
Hübschheit zählt.
Tom Andersen
4
window.location = urlist schöner
Eric Muyser
21
location = urlist niedlicher
fregante
20

Vor ein paar Jahren locationfunktionierte nicht für mich im IE und location.hreftat es (und beide arbeiteten in anderen Browsern). Seitdem habe ich immer nur benutzt location.hrefund hatte nie wieder Probleme. Ich kann mich nicht erinnern, welche Version von IE das war.

Dovev Hefetz
quelle
42
Es war wahrscheinlich diese eine Version von IE, in der es etwas falsch gemacht hat und jeder andere Browser es richtig gemacht hat. ;-)
Shawn D.
9
in strict modeChrome wird eine Ausnahme locationlocation.href
auslösen,
9
"eine" Version von IE?
Lpc_dark
@Shawn D. Ein Browser, der die Dinge richtig macht? Wann ist das passiert! : D
user2173353
15

Nur um zu verdeutlichen, können Sie nicht tun location.split('#'), locationist ein Objekt, keine Zeichenfolge. Aber Sie können tun, location.href.split('#');weil location.hrefist eine Zeichenfolge.

Chadams
quelle
3
Ihr Kommentar ist wahr, aber Sie sprechen immer das Attribut href, eine Zeichenfolge, des Standortobjekts. In allen anderen Diskussionen geht es darum , einen Wert zuzuweisen und nicht den Wert zu lesen. Aber dein Punkt ist richtig. Der Unterschied besteht darin, dass href eine Zeichenfolge ist, während location ein Objekt ist.
Phil DD
15

Ein Unterschied, den Sie jedoch beachten sollten.

Angenommen, Sie möchten eine URL mit der aktuellen URL erstellen. Der folgende Code leitet Sie tatsächlich weiter, da er nicht aufruft, String.replacesondern Location.replace:

nextUrl = window.location.replace('/step1', '/step2');

Die folgenden Codes funktionieren:

// cast to string
nextUrl = (window.location+'').replace('/step1', '/step2');

// href property
nextUrl = window.location.href.replace('/step1', '/step2');
Gras Double
quelle
3

Mit Typoskript Verwendung window.location.hrefals window.locationtechnisch ein Objekt enthält:

Properties
hash 
host 
hostname
href    <--- you need this
pathname (relative to the host)
port 
protocol 
search

Die Einstellung window.locationführt zu einem Typfehler, während window.location.hrefes sich um eine Typzeichenfolge handelt.

Quelle

Blau
quelle