JavaScript: ustawianie lokalizacji. Przegląd a lokalizacja

311

Kiedy ustawisz locationciąg adresu URL a ustawienie location.href?

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

vs

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

Dokumentacja Mozilla Developer Network

javascript chimeryczny
źródło
6
ustawianie location.hrefnie powiodło się z powodu zasad tego samego pochodzenia: javascript.info/tutorial/…
Taha Jahangir
Ponadto replacei assign: stackoverflow.com/q/1865837/632951 , stackoverflow.com/q/7703689/632951 , stackoverflow.com/q/10302905/632951
Pacerier
1
Mam aplikację Angular 4, która korzysta z TypeScript 2.6.2. window.location jest tylko do odczytu i mogę przypisywać tylko za pomocą window.location.href (w kontekście wywołania zwrotnego z subskrypcji kątowej), bez zgłaszania błędów kompilatora - może to coś w rodzaju zgodności z JavaScript 1.0 lub związane z obsługą asynchroniczną . Zasadniczo okno.location.href wydaje się być jedyną rzeczą, która zawsze działa.
Chris Halcrow

Odpowiedzi:

261

Możesz ustawić locationbezpośrednio, ponieważ jest nieco krótszy. Jeśli próbujesz być zwięzły, zwykle możesz też pominąć window..

URL przypisania do obu location.hrefi locationsą zdefiniowane do pracy w JavaScript 1.0, z powrotem w Netscape 2 i zostały wdrożone w każdej przeglądarce międzyczasie. Wybierz więc i użyj tego, co znajdziesz najwyraźniej.

Bobin
źródło
9
Jak wspomniano w @SwissMister w odpowiedzi poniżej, wygląda na to, że window.location.href jest traktowane jak żądanie XHR. Jeśli zostanie zwolniony z wywołania zwrotnego sukcesu XHR, window.location.href będzie traktowany jako XHR, podczas gdy window.location emuluje kliknięcie łącza.
Akshay Raje,
147

Nawet jeśli oba działają, użyłbym tego drugiego. locationjest obiektem, a przypisanie łańcucha do obiektu nie wróży dobrze dla czytelności lub konserwacji.

psychotik
źródło
60
Podczas wdrażania złożonej integracji z systemem PayPal napotkałem bardzo ważny powód, aby go użyć window.location: nie wymagaSAME ORIGIN .
Szwajcarski Mister
4
Może to tylko ja, ale location = 'http://www.example.com'wydaje się bardzo czytelna. Chociaż jako szczególny przypadek. To jest kompatybilne wstecz i pozostanie kompatybilne w dającej się przewidzieć przyszłości.
Alex W
10
Jeśli obiekt window.location byłby obiektem, przypisanie do niego ciągu spowoduje zastąpienie go ciągiem. W rzeczywistości window.location jest właściwością, która ma metody pobierające i ustawiające. Po ustawieniu oczekiwany jest ciąg znaków, a globalny obiekt położenia jest aktualizowany przez ustawiającego. Gdy go otrzymasz, zwracany jest globalny obiekt lokalizacji.
JukkaP
64

Jak już powiedziano, locationjest przedmiotem . Ale ta osoba zasugerowała użycie jednego z nich. Ale lepiej będzie użyć tej .hrefwersji.

Obiekty mają właściwości domyślne, które, o ile nie określono inaczej, są przyjmowane. W przypadku locationobiektu ma właściwość o nazwie .href. Nie podając ŻADNEJ właściwości podczas przypisywania, domyślnie przyjmuje wartość „href”.

Wszystko jest w porządku, dopóki nie zmieni się późniejsza wersja modelu obiektowego i albo nie ma już właściwości domyślnej, albo właściwość domyślna zostaje zmieniona. Wtedy twój program nieoczekiwanie psuje się.

Jeśli masz na myśli href, powinieneś podać href.

Kirby L. Wallace
źródło
13
Dobre wyjaśnienie, lepsze niż ogólne komentarze na temat czytelności lub konserwacji. W rzeczywistości w tym konkretnym przypadku model obiektowy nie zostanie zmieniony, ponieważ połowa sieci zatrzymałaby się - dlatego użyj albo ... to nie ma znaczenia, które
Neromancer
71
Brzmi dobrze, ale tak naprawdę nie jest prawdą. Ogólnie nie ma koncepcji domyślnej właściwości w DOM ani JavaScript. Przypisywanie ciągu do locationdziałania, ponieważ właściwość została zdefiniowana tak, aby mieć to specjalne zachowanie przypisania z powrotem w JavaScript 1.0 i od tej pory każda przeglądarka to zaimplementowała. HTML5 teraz tego wymaga. Więc chociaż przypisywanie do tego może być ładniejsze lub bardziej spójne .href, nie ma w tym żadnej przewagi kompatybilności wstecznej ani w przód.
bobince
6
liczy się ładność.
Tom Andersen
4
window.location = urljest ładniejszy
Eric Muyser
21
location = urljest
ładniejszy
20

Kilka lat temu locationnie działało dla mnie w IE i location.hrefdziałało (i oba działały w innych przeglądarkach). Od tego czasu zawsze używałem location.hrefi nigdy więcej nie miałem problemów. Nie pamiętam, która to była wersja IE.

Dovev Hefetz
źródło
42
Prawdopodobnie była to jedna wersja IE, w której działał źle, a każda inna przeglądarka działała poprawnie. ;-)
Shawn D.,
9
w strict modechrome wyrzuci wyjątek, jeśli spróbujesz przypisać również bezpośrednio location, więc zawsze używamlocation.href
Hashbrown
9
„jedna” wersja IE?
Lpc_dark
@Shawn D. Przeglądarka robi wszystko poprawnie? Kiedy to się stało! : D
user2173353,
15

Aby wyjaśnić, nie możesz tego zrobić location.split('#'), locationto obiekt, a nie ciąg znaków. Ale możesz to zrobić, location.href.split('#');ponieważ location.hrefto ciąg znaków.

Czadamy
źródło
3
Twój komentarz jest prawdziwy, ale mówisz o uzyskaniu atrybutu href, ciągu znaków obiektu położenia. Wszystkie pozostałe dyskusje dotyczą przypisywania wartości, a nie odczytywania wartości. Ale masz rację. Różnica polega na tym, że href jest ciągiem, podczas gdy lokalizacja jest obiektem.
Phil DD,
15

Należy jednak pamiętać o jednej różnicy.

Załóżmy, że chcesz zbudować jakiś adres URL przy użyciu bieżącego adresu URL. Poniższy kod przekieruje cię, ponieważ nie dzwoni, String.replaceale Location.replace:

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

Działa następujące kody:

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

// href property
nextUrl = window.location.href.replace('/step1', '/step2');
Gras Double
źródło
3

Z maszynopis użytku window.location.hrefjak window.locationto technicznie obiekt zawierający:

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

Ustawienie window.locationspowoduje wystąpienie błędu typu, podczas gdy window.location.hrefjest typu string.

Źródło

Niebieski
źródło