¿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

rahul
fuente
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.

Christoph
fuente
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).

Frédéric Hamidi
fuente
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
44

document.locationoriginalmente era una propiedad de solo lectura, aunque los navegadores Gecko también le permiten asignarle. Para la seguridad del navegador cruzado, use window.locationen su lugar.

Lee mas:

document.location

window.location

diEcho
fuente
No puedo encontrar una respuesta clara cuando usar cualquiera de ellos, mira mi respuesta a continuación
M.Abulsoud
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!')
Phil Hamer
fuente
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.

Macho alfa
fuente
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

TÚ
fuente
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
Matthew Flaschen
fuente
8

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

Dave Ward
fuente
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.

Marquinho Peli
fuente
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.

azhar_salati
fuente
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.

Gene Karasev
fuente
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.

Justin
fuente
2

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

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

divHelper11
fuente
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.

Kainax
fuente
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

M.Abulsoud
fuente