Jaka jest różnica między window.location a document.location w JavaScript?

241

Czy oba powinny odwoływać się do tego samego obiektu?

javascript window.location Morgan Cheng
źródło
1
Przykład

Odpowiedzi:

220

Według W3C są one takie same. W rzeczywistości dla bezpieczeństwa w różnych przeglądarkach powinieneś używać window.locationzamiast document.location.

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

Rahul
źródło
12
Doceniony. Odpowiedź sprzeczna. Odważnie mówi, że są takie same, a następnie opisuje różnice w jaśniejszym tekście. Zdecydowanie nie są takie same.
danorton
33
Daj radosnych wyborców, trochę rozjaśnij. W przeważającej części zachowują się podobnie, ZWAŻYWSZY NA PRZESTRZEŃ OKREŚLONĄ przez rahula. Nie przytykajmy go do semantyki. Trochę Filadelfii, panowie. Dla mnie, jego odpowiedź była w pełni satysfakcjonująca. +1 (odpowiedź Christopha powinna być zaakceptowana, ale odpowiedź Rahula jest do zaakceptowania - przynajmniej nie jest warta głosowania w dół).
cssyphus 20.12. O
7
-1 za zalecenie najlepszej praktyki (zawsze stosowanie window.location) bez podania jej uzasadnienia. Jeśli nie podasz uzasadnienia, dlaczego ktoś miałby skorzystać z Twojej porady? Odpowiedź Christopha jest o wiele bardziej przydatna w tym względzie.
Mark Amery
+1, ale także poniżej widzą odpowiedzi Phila Hamera i Christopha, dodają podstawowe informacje podstawowe i zastrzeżenia, aby w pełni zrozumieć problem.
Jon z
Właściwie zauważam różnicę między nimi, na przykład, jeśli chcesz nawigować do ramki w piaskownicy z ramki podrzędnej, możesz to zrobić tylko za pomocą document.location, ale nie za pomocą window.location
M.Abulsoud
207

Kanonicznym sposobem uzyskania bieżącego obiektu lokalizacji jest window.location(patrz strona MSDN z 1996 r. I szkic W3C z 2006 r .).

Porównaj to z document.location, które pierwotnie zwróciło tylko bieżący adres URL jako ciąg (zobacz tę stronę w MSDN ). Prawdopodobnie, aby uniknąć nieporozumień, document.locationzostał zastąpiony document.URL(patrz tutaj na MSDN ), który jest również częścią DOM Level 1 .

O ile mi wiadomo, wszystkie nowoczesne przeglądarki map document.locationdo window.location, ale ja wciąż wolą window.locationjako że właśnie użyłem ponieważ napisałem mój pierwszy DHTML.

Christoph
źródło
1
jeśli użyjesz window.location, czy nie jest równie uzasadnione samo użycie location?
commonpike
2
@commonpike To jest - w kontekście skryptu w [przynajmniej] dokumencie HTML, obiektem globalnym, w którym wszystkie zdefiniowane zmienne stają się właściwościami, jest windowobiektem. Zatem dowolna zmienna lub funkcja zdefiniowana na najwyższym poziomie skryptu jest właściwością obiektu window, do którego się odwołuje , którym jest obiekt globalny. Obiekt globalny jest implikowany, gdy jest nieobecny jak window.- w ten sposób locationinterpretowany jest jako window.location. Zastrzeżenia - fe if(an_undefined_variable)wyrzuci błąd, jeśli zmienna nie została zdefiniowana - if(window.an_undefined_variable)nie zrobi tego.
rano
92

Window.location jest do odczytu / zapisu we wszystkich zgodnych przeglądarkach.

Document.location jest tylko do odczytu w Internet Explorerze (przynajmniej), ale do odczytu / zapisu w przeglądarkach opartych na Gecko (Firefox, SeaMonkey).

Frédéric Hamidi
źródło
10
Nie mogę odtworzyć oświadczenia, które document.locationjest tylko do odczytu w IE. Mogę z powodzeniem przypisać do niego w IE 10, 9, 8 i 6 (przy użyciu maszyn wirtualnych z modern.ie ).
Mark Amery
jakieś komentarze na temat console.log(location);? !!
Fr0zenFyr
44

document.locationbyła pierwotnie właściwością tylko do odczytu, chociaż przeglądarki Gecko pozwalają również na przypisanie do niej. Dla bezpieczeństwa w różnych przeglądarkach użyj window.locationzamiast tego.

Czytaj więcej:

document.location

window.location

diEcho
źródło
Nie mogę znaleźć jednoznacznej odpowiedzi, kiedy użyć któregokolwiek z nich, spójrz na moją odpowiedź poniżej
M.Abulsoud,
37

Co ciekawe, jeśli masz ramkę, obraz lub formularz o nazwie „lokalizacja”, wówczas „document.location” zapewnia odniesienie odpowiednio do okna ramki, obrazu lub formularza zamiast obiektu Location. Najwyraźniej dzieje się tak, ponieważ wyszukiwanie nazw kolekcji document.forms, document.images i window.frames ma pierwszeństwo przed odwzorowaniem na window.location.

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

if (document.location.tagName == 'IMG') alert('Hello!')
Phil Hamer
źródło
2
Nie ma priorytetu, jest po prostu nadpisany
Pacerier
7
Nie, to nie jest nadpisane. Jest zacieniony, więc Phil ma rację, że pierwszeństwo pierwiastków ma miejsce podczas rozstrzygania właściwości.
kangax
@kangax, Wygląda na to, że masz rację: jsfiddle.net/uL4ysszr . Ale jak wiarygodne jest to zachowanie? Czy jest wystarczająco przeglądarkowy?
Pacerier
1
Właśnie to przetestowałem (październik 2016 r.). Wydaje się, że window.locationi document.locationnie może być zasłonięta w Chrome lub Firefox.
Pan Llama,
1
@ Mr.Llama Masz rację. Wygląda na to, że wszystkie nowoczesne przeglądarki nie zachowują się już w sposób opisany powyżej. Wydaje się, że wynika to z nadania document.location atrybutu „Unforgeable”. Odpowiednia zmiana Chromium: src.chromium.org/viewvc/blink?view=revision&revision=189862 I błąd przeglądarki Firefox: bugzilla.mozilla.org/show_bug.cgi?id=1133760
Phil Hamer
27

O ile mi wiadomo, oba są takie same. Dla bezpieczeństwa w różnych przeglądarkach możesz użyć window.locationzamiast document.location.

Wszystkie nowoczesne przeglądarki map document.locationdo window.location, ale nadal preferująwindow.location jako że właśnie użyłem odkąd napisałem swoją pierwszą stronę internetową. jest bardziej spójny.

możesz także zobaczyć document.location === window.locationzwroty true, co wyjaśnia, że ​​oba są takie same.

Samiec alfa
źródło
14

document.location === window.location zwroty true

również

document.location.constructor === window.location.constructor jest true

Uwaga: właśnie przetestowane na Firefox 3.6, Opera 10 i IE6

TY
źródło
1
@Pacerier Dlaczego? Dla obiektów ===i ==są równoważne.
Mark Amery
4
@ MarkAmery, To źle i można to łatwo wykazać: "abc" == new String("abc")zwraca truepodczas "abc" === new String("abc")powrotu false.
Pacerier
7
@Pacerier Okay, pozwólcie, że stwierdzę to nieco bardziej rygorystycznie i mniej dwuznacznie: porównując dwa obiekty ze sobą (a nie tylko obiekt z czymkolwiek) ==i ===są one równoważne. Zobacz specyfikacje w sekcjach 11.9.3 i 11.9.6. W przypadku wartości niepustych, nieokreślonych, niepoliczalnych, nieobsługujących wartości bool i ciągów o tym samym typie ==zachowanie jest regulowane w 11.9.3 część 1f, a ===zachowanie w 11.9.6 część 7, które identycznie brzmią Zwróć, truejeśli xiy odnoszą się do tego samego obiektu. W przeciwnym razie wróć false.
Mark Amery
10
@MarkAmery, nie ma gwarancji, że oba document.locationi window.locationsą skierowane do obiektów. Brakuje ci całego punktu potrójnych równości; użycie 2 równa się nie dowodzi , że są one tym samym obj. Powinniśmy użyć 3 równych, a nie 2 równych, ponieważ 2 równe dadzą nam fałszywie dodatni. W przeglądarce, w której document.location jest ciągiem URL równym window.location.toString(), wówczas document.location==window.locationzwróci true, a document.location===window.locationzwróci false.
Pacerier
@Pacerier Aha - w końcu to rozumiem. Masz całkowitą rację, przynajmniej jeśli chodzi o document.location === window.locationporównanie. Fakt, że .constructorporównanie jest również wrzucone, oznacza, jak sądzę, że ta odpowiedź jest nadal trafna, ale użycie ===uprościłoby rozumowanie.
Mark Amery
11

Tak, są takie same. Jest to jedno z wielu historycznych dziwactw w interfejsie API JS przeglądarki. Spróbuj zrobić:

window.location === document.location
Matthew Flaschen
źródło
8

Window.location jest bardziej niezawodnie spójny z tymi dwoma, biorąc pod uwagę starsze przeglądarki.

Dave Ward
źródło
3

Obecnie rzadko widać różnicę, ponieważ HTML 5 nie obsługuje już zestawów ramek. Ale w momencie, gdy mamy zestaw ramek, document.location przekierowuje tylko ramkę, w której wykonywany jest kod, a window.location przekierowuje całą stronę.

Marquinho Peli
źródło
2

Powiedziałbym, że window.locationjest to bardziej niezawodny sposób na uzyskanie bieżącego adresu URL . Poniżej znajduje się różnica między window.locationidocument.url który przyszedł z przodu w jednym ze scenariuszy, gdzie byłem załączonych parametrów mieszania w adresie URL i czytanie go później.

Po dodaniu parametrów skrótu w adresie URL.

W starszej przeglądarce nie byłem w stanie uzyskać parametrów skrótu z adresu URL za pomocą document.url, ale kiedy użyłemwindow.location byłem w stanie uzyskać parametry skrótu z adresu URL.

Dlatego zawsze lepiej jest używać window.location.

azhar_salati
źródło
1
-1. Pytanie nawet nie wspomniało document.URL- chodziło o window.locationi document.location. Również document.urlnie istnieje = powinna być pisana wielkimi literami.
Mark Amery
2

document.location.constructor === window.location.constructor jest true .

Jest tak, ponieważ jest to dokładnie ten sam obiekt, z którego widać document.location===window.location .

Nie ma więc potrzeby porównywania konstruktora ani żadnej innej właściwości.

Gene Karasev
źródło
2

Przynajmniej w IE ma małą różnicę w pliku lokalnym:

document.URL zwróci „plik: // C: \ projects \ abc \ a.html”

ale window.location.href zwróci „plik: /// C: /projects/abc/a.html”

Jeden to cięcie wstecz, jeden to cięcie do przodu.

Justin
źródło
2

Cóż, są takie same, ale ....!

window.location nie działa w niektórych przeglądarkach Internet Explorer.

divHelper11
źródło
0

Pomimo tego, że większość ludzi tutaj poleca, tak wyglądał dynamiczny wycinek protokołu Google Analytics od wieków (zanim ostatnio przeszli z ga.js na analytics.js):

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

Więcej informacji: https://developers.google.com/analytics/devguides/collection/gajs/

W nowej wersji użyli „//”, aby przeglądarka mogła automatycznie dodać protokół:

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

Więc jeśli Google preferuje document.location dowindow.location kiedy potrzebują protokołu w JS, myślę, że oni mają jakieś powody.

OGÓŁEM : Osobiście w to wierzę document.locationi window.locationsą takie same, ale jeśli gigant z największymi statystykami na temat korzystania z przeglądarek takich jak Google za pomocą document.location , polecam je śledzić.

Kainax
źródło
2
Nie głosowałem jednak za tym, ponieważ może to być bardzo stare pytanie, a twoja odpowiedź nie dostarcza żadnych nowych ani cennych dowodów na to, że jedno jest lepsze od drugiego. Może być tak, ponieważ twoja odpowiedź sugeruje przeciwieństwo opinii publicznej, niezależnie od zasług, jakie dajesz temu, co Google zrobił historycznie. Lub może być tak, że downvoter po prostu nie lubił, jak kładziesz nacisk na te części odpowiedzi, które tak naprawdę nie wymagają podkreślania. To może być cokolwiek naprawdę. To jest piękno anonimowego głosowania na SO.
M.Babcock
0

Właściwie zauważam różnicę w chromie między nimi, na przykład jeśli chcesz nawigować do ramki w piaskownicy z ramki podrzędnej, możesz to zrobić tylko za pomocą document.location, ale nie za pomocą window.location

M.Abulsoud
źródło