¿Cuál es la diferencia entre window.location y document.location en JavaScript?


Respuestas:


220

Según el W3C, son lo mismo. En realidad, para la seguridad del navegador cruzado, debe usar en window.locationlugar de document.location.

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


12
Voto negativo Respuesta contradictoria. Audazmente dice que son iguales, luego describe las diferencias en el texto más claro. Definitivamente no son lo mismo.
danorton

33
Vamos, gatillo feliz abajo votantes, relájate un poco. En su mayor parte, se comportan de manera similar CONSIDERANDO LA CUEVA ESPECIFICADA por rahul. No lo clavamos en la semántica. Un pequeño Filadelfia, caballeros. Yo, por mi parte, encontré su respuesta completamente satisfactoria. +1 (Christoph debería ser la respuesta aceptada, pero la de Rahul es aceptable, al menos, no merece un voto
negativo

77
-1 por recomendar una mejor práctica (siempre usando window.location) sin proporcionar ninguna justificación para ello. Si no proporciona la justificación, ¿por qué alguien debería seguir su consejo? La respuesta de Christoph es mucho más útil a este respecto.
Mark Amery

+1 pero también ve las respuestas de Phil Hamer y Christoph a continuación, agregan información esencial de fondo y advertencias para comprender completamente el problema.
Jon z

En realidad, noto una diferencia entre ambos, por ejemplo, si desea navegar a un marco de espacio aislado desde un marco secundario, puede hacerlo solo con document.location pero no con window.location
M.Abulsoud

207

La forma canónica de obtener el objeto de ubicación actual es window.location(consulte esta página de MSDN de 1996 y el borrador del W3C de 2006 ).

Compare esto con document.location, que originalmente solo devolvió la URL actual como una cadena (consulte esta página en MSDN ). Probablemente para evitar confusiones, document.locationse reemplazó con document.URL(ver aquí en MSDN ), que también forma parte del DOM Nivel 1 .

Por lo que yo sé, todos los navegadores modernos mapa document.locationa window.location, pero todavía prefieren window.locationya que es lo que he usado desde que escribí mi primer DHTML.


1
si lo usa window.location, ¿no es igualmente válido usarlo location?
commonpike

2
@commonpike Es: en el contexto de un script en [al menos] un documento HTML, el objeto global donde todas las variables definidas se convierten en propiedades, es el windowobjeto. Por lo tanto, cualquier variable o función que defina en el nivel superior de su script es una propiedad del objeto al que hace referencia window, que resulta ser el objeto global. El objeto global está implícito cuando está ausente window., por lo que locationse interpreta que es window.location. Advertencias: fe if(an_undefined_variable)arrojará un error si la variable no se definió if(window.an_undefined_variable), no lo hará.
amn

92

window.location es de lectura / escritura en todos los navegadores compatibles.

document.location es de solo lectura en Internet Explorer (al menos), pero de lectura / escritura en navegadores basados ​​en Gecko (Firefox, SeaMonkey).


10
No puedo reproducir el reclamo document.locationde solo lectura en IE. Puedo asignarlo con éxito en IE 10, 9, 8 y 6 (usando máquinas virtuales de modern.ie ).
Mark Amery

¿Algún comentario sobre console.log(location);?
Fr0zenFyr


37

Curiosamente, si tiene un marco, imagen o formulario llamado 'ubicación', entonces 'document.location' proporciona una referencia a la ventana, imagen o formulario del marco, respectivamente, en lugar del objeto Ubicación. Aparentemente, esto se debe a que la búsqueda de nombre de colección document.forms, document.images y window.frames tiene prioridad sobre la asignación a window.location.

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

if (document.location.tagName == 'IMG') alert('Hello!')

2
No hay prioridad, simplemente se sobrescribe
Pacerier

77
No, no se sobrescribe. Está sombreado, por lo que Phil tiene razón acerca de que el elemento tiene prioridad durante la resolución de la propiedad.
kangax

@kangax, parece que tienes razón: jsfiddle.net/uL4ysszr . Pero, ¿qué tan confiable es este comportamiento? ¿Es lo suficientemente cruzado?
Pacerier

1
Acabo de probar esto (octubre de 2016). Parece ser que window.location, y document.locationno puede ser ensombrecida en Chrome o Firefox.
Sr. Llama

1
@ Mr.Llama Tienes razón. Parece que todos los navegadores modernos ya no se comportan de la manera que describí anteriormente. Parece que se debe a dar a document.location el atributo "Inolvidable". Cambio de cromo relevante: src.chromium.org/viewvc/blink?view=revision&revision=189862 Y error de Firefox: bugzilla.mozilla.org/show_bug.cgi?id=1133760
Phil Hamer

27

Que yo sepa, ambos son lo mismo. Para la seguridad del navegador cruzado puede usar en window.locationlugar de document.location.

Todos los navegadores modernos mapa document.locationa window.location, pero todavía prefieren window.locationya que es lo que he usado desde que escribí mi primera página web. Es más consistente.

También puede ver document.location === window.locationdevoluciones true, lo que aclara que ambos son iguales.


14

document.location === window.location devoluciones true

además

document.location.constructor === window.location.constructor es true

Nota: Acabo de probar en Firefox 3.6, Opera 10 e IE6


1
@Pacerier ¿Por qué? Para objetos, ===y ==son equivalentes.
Mark Amery

44
@ MarkAmery, eso está mal y se puede demostrar fácilmente: "abc" == new String("abc")regresa truemientras "abc" === new String("abc")regresa false.
Pacerier

77
@Pacerier Bien, permítanme decirlo de manera un poco más rigurosa y menos ambigua: cuando se comparan dos objetos entre sí (en lugar de solo un objeto con cualquier cosa), ==y ===son equivalentes. Consulte las secciones de especificaciones 11.9.3 y 11.9.6. Para valores no nulos, no indefinidos, no numéricos, no booleanos, sin cadenas con el mismo tipo, el ==comportamiento se rige por 11.9.3 parte 1f, y el ===comportamiento por 11.9.6 parte 7, que lee idénticamente Retorno truesi x e y se refieren al mismo objeto. De lo contrario, regrese false.
Mark Amery

10
@MarkAmery, No hay garantía de que tanto document.locationy window.locationestán apuntando a los objetos. Te estás perdiendo todo el punto de triples iguales; usar 2 iguales no prueba que sean el mismo obj. Deberíamos usar 3 iguales y no 2 iguales porque 2 iguales nos darán un falso positivo. En un navegador donde document.location es una cadena URL igual a window.location.toString(), entonces document.location==window.locationdevolverá verdadero mientras document.location===window.locationque devolverá falso.
Pacerier

@Pacerier Aha: por fin lo entiendo. Tienes toda la razón, al menos en lo que respecta a la document.location === window.locationcomparación. El hecho de que la .constructorcomparación también se incluya significa, creo, que esta respuesta sigue siendo sólida, pero el uso ===simplificaría el razonamiento.
Mark Amery

11

Sí, son lo mismo. Es una de las muchas peculiaridades históricas en la API JS del navegador. Trata de hacerlo:

window.location === document.location

8

window.location es el más confiablemente consistente de los dos, considerando los navegadores más antiguos.


3

Es raro ver la diferencia hoy en día porque html 5 ya no admite conjuntos de marcos. Pero en el momento en que tenemos el conjunto de marcos, document.location redirigiría solo el marco en el que se ejecuta el código, y window.location redirigiría toda la página.


2

Yo diría que window.locationes la forma más confiable de obtener la URL actual . A continuación se muestra la diferencia entre el window.locationy el document.urlque apareció al frente en uno de los escenarios en los que agregué parámetros hash en la URL y los leí más tarde.

Después de agregar parámetros hash en la URL.

En un navegador antiguo, no pude obtener los parámetros hash de la URL mediante el uso document.url, pero cuando lo window.locationhice pude obtener los parámetros hash de la URL.

Por lo tanto, siempre es mejor usar window.location.


1
-1. La pregunta ni siquiera mencionó document.URL: se trataba de window.locationy document.location. Además, document.urlno existe = debe estar en mayúscula.
Mark Amery

2

document.location.constructor === window.location.constructores true.

Es porque es exactamente el mismo objeto que puedes ver document.location===window.location.

Por lo tanto, no es necesario comparar el constructor ni ninguna otra propiedad.


2

Al menos en IE, tiene una pequeña diferencia en el archivo local:

document.URL devolverá "file: // C: \ projects \ abc \ a.html"

pero window.location.href devolverá "file: /// C: /projects/abc/a.html"

Una es la barra diagonal inversa, la otra es barra diagonal.


2

Bueno, sí, son lo mismo, pero ...!

window.location no funciona en algunos navegadores de Internet Explorer.


0

A pesar de que la mayoría de las personas lo recomiendan aquí, así es como se veía el protocolo dinámico de Google Analytics recortado durante siglos (antes de que se mudaran de ga.js a analytics.js recientemente):

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

Más información: https://developers.google.com/analytics/devguides/collection/gajs/

En la nueva versión usaron '//' para que el navegador pueda agregar automáticamente el protocolo:

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

Entonces, si Google prefiere document.location a window.locationcuando necesitan protocolo en JS, supongo que tienen algunas razones para eso.

GENERAL : personalmente creo eso document.locationy window.locationson lo mismo, pero si es gigante con mayores estadísticas sobre el uso de navegadores como Google usando document.location , recomiendo seguirlos.


2
Sin embargo, no voté en contra, podría ser porque esta es una pregunta muy antigua y su respuesta no proporciona ninguna evidencia nueva o valiosa de que una sea mejor que la otra. O bien, podría deberse a que su respuesta sugiere lo contrario de la opinión pública, independientemente del mérito que otorgue a lo que Google ha hecho históricamente. O bien, podría ser que al votante no le gustó cómo pone énfasis en partes de su respuesta que realmente no necesitan énfasis. Podría ser cualquier cosa realmente. Esa es la belleza del voto anónimo en SO.
M.Babcock

0

En realidad, noto una diferencia en el cromo entre ambos. Por ejemplo, si desea navegar a un marco de espacio aislado desde un marco secundario, puede hacerlo solo con document.location pero no con window.location

Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.