Javascript: настройка location.href в зависимости от местоположения

311

Когда вы установите locationстроку URL-адреса в сравнении с настройкой location.href?

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

против

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

Справочник по сети разработчиков Mozilla

javascript химерический
источник
6
установка location.hrefпочты не удалась из-за политики одного и того же происхождения: javascript.info/tutorial/…
Таха Джахангир
Кроме того , replaceи assign: stackoverflow.com/q/1865837/632951 , stackoverflow.com/q/7703689/632951 , stackoverflow.com/q/10302905/632951
Pacerier
1
У меня есть приложение Angular 4, которое использует TypeScript 2.6.2. window.location доступен только для чтения, и я могу назначить его только с помощью window.location.href (в контексте обратного вызова из угловой подписки), без учета ошибок компилятора - возможно, это какая-то вещь совместимости JavaScript 1.0 или связанная с асинхронной обработкой , В основном, window.location.href - единственное, что всегда работает.
Крис Хэлкроу

Ответы:

262

Вы можете установить locationпрямо, потому что это немного короче. Если вы пытаетесь быть кратким, вы обычно можете опустить window.тоже.

Назначения URL для обоих location.hrefи locationопределены для работы в JavaScript 1.0, обратно в Netscape 2, и с тех пор были реализованы в каждом браузере. Так что выбирайте и используйте то, что вы найдете наиболее ясным.

bobince
источник
10
Как упомянуто @SwissMister в ответе ниже, кажется, что window.location.href несколько обрабатывается как запрос XHR. Если сработал из обратного вызова XHR, то window.location.href будет обрабатываться как XHR, а window.location эмулирует нажатие на ссылку.
Акшай Радж
147

Даже если оба работают, я бы использовал последний. locationявляется объектом, и назначение строки объекту не сулит ничего хорошего для удобства чтения или обслуживания.

psychotik
источник
61
При реализации сложной интеграции PayPal я столкнулся с очень веской причиной для использования window.location: она не требуетSAME ORIGIN .
швейцарский господин
4
Может быть, это только я, но location = 'http://www.example.com'кажется супер читабельным. Хотя, как особый случай. Это обратно совместимо и останется совместимым в обозримом будущем.
Алекс W
10
Если бы window.location был объектом, присвоение ему строки перезаписало бы его строкой. Фактически window.location - это свойство, которое имеет методы getter и setter. Когда вы устанавливаете его, ожидается строка и глобальный объект Location обновляется установщиком. Когда вы получаете его, возвращается глобальный объект Location.
JukkaP
64

Вроде как уже было сказано, locationэто объект . Но этот человек предложил использовать либо. Но вы будете лучше использовать .hrefверсию.

Объекты имеют свойства по умолчанию, которые, если ничего не указано, они предполагаются. В случае locationобъекта это свойство называется .href. И, не указав ЛЮБОЕ свойство во время присваивания, он примет «href» по умолчанию.

Это все хорошо, пока не изменится более поздняя версия объектной модели и не будет больше свойства по умолчанию или свойства по умолчанию. Тогда ваша программа неожиданно обрывается.

Если вы имеете в виду href, вы должны указать href.

Кирби Л. Уоллес
источник
13
Хорошее объяснение, лучше, чем просто общие комментарии о читаемости или обслуживании. В действительности в данном конкретном случае объектная модель не изменится, так как половина сети остановится - поэтому используйте либо ... не важно, какой
Neromancer
71
Это звучит хорошо, но на самом деле это не так. В DOM или JavaScript вообще нет понятия свойства по умолчанию. Присвоение строки locationработам, потому что свойство было определено так, чтобы это специальное поведение присваивалось обратно в JavaScript 1.0, и каждый браузер с тех пор реализовал это. HTML5 теперь требует этого. Таким образом, хотя назначение может быть более привлекательным или более последовательным .href, в этом нет преимущества обратной или прямой совместимости.
bobince
6
Красивость имеет значение.
Том Андерсен
4
window.location = urlкрасивее
Эрик Муйзер
21
location = urlсимпатичнее
Фреганте
20

Пару лет назад locationу меня не работало в IE и location.hrefработало (и оба работали в других браузерах). С тех пор я всегда просто использовал location.hrefи никогда не было проблем снова. Я не могу вспомнить, какая версия IE была.

Довев Хефец
источник
42
Вероятно, это была одна версия IE, в которой все было не так, а все остальные браузеры делали это правильно. ;-)
Шон Д.
9
в strict modeChrome будет выдавать исключение, если вы пытаетесь назначить непосредственно на locationтоже, поэтому я всегда используюlocation.href
Hashbrown
9
«одна» версия IE?
Lpc_dark
@ Шон Д. Браузер делает вещи правильно? Когда это произошло! : D
user2173353
15

Просто уточнить, вы не можете сделать location.split('#'), locationэто объект, а не строка. Но вы можете сделать, location.href.split('#');потому что location.hrefэто строка.

Chadams
источник
3
Ваш комментарий верен, но вы говорите о получении атрибута href, строки, объекта location. Все остальные обсуждения касаются присвоения значения, а не чтения значения. Но ваша точка зрения верна. Разница в том, что href - это строка, а location - это объект.
Фил ДД,
15

Однако нужно помнить одно различие.

Допустим, вы хотите создать какой-то URL, используя текущий URL. Следующий код фактически перенаправит вас, потому что это не вызов, String.replaceа Location.replace:

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

Работают следующие коды:

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

// href property
nextUrl = window.location.href.replace('/step1', '/step2');
Гра Двухместный
источник
3

С TypeScript используйте window.location.hrefкак window.locationтехнически объект, содержащий:

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

Установка window.locationприведет к ошибке типа, в то время как window.location.hrefимеет тип строки.

Источник

синий цвет
источник