What's the difference between window.location and document.location in JavaScript?
Javascriptwindow.locationJavascript Problem Overview
Should both of them reference the same object?
Javascript Solutions
Solution 1 - Javascript
According to the W3C, they are the same. In reality, for cross browser safety, you should use window.location
rather than document.location
.
Solution 2 - Javascript
The canonical way to get the current location object is window.location
(see this MSDN page from 1996 and the W3C draft from 2006).
Compare this to document.location
, which originally only returned the current URL as a string (see this page on MSDN). Probably to avoid confusion, document.location
was replaced with document.URL
(see here on MSDN), which is also part of DOM Level 1.
As far as I know, all modern browsers map document.location
to window.location
, but I still prefer window.location
as that's what I've used since I wrote my first DHTML.
Solution 3 - Javascript
window.location is read/write on all compliant browsers.
document.location is read-only in Internet Explorer (at least), but read/write in Gecko-based browsers (Firefox, SeaMonkey).
Solution 4 - Javascript
document.location
was originally a read-only property, although Gecko browsers allow you to assign to it as well. For cross-browser safety, use window.location
instead.
Read more:
Solution 5 - Javascript
Interestingly, if you have a frame, image, or form named 'location', then 'document.location' provides a reference to the frame window, image, or form, respectively, instead of the Location object. Apparently, this is because the document.forms, document.images, and window.frames collection name lookup gets priority over the mapping to window.location.
<img name='location' src='location.png'>
if (document.location.tagName == 'IMG') alert('Hello!')
Solution 6 - Javascript
As far as I know, Both are same. For cross browser safety you can use window.location
rather than document.location
.
All modern browsers map document.location
to window.location
, but I still prefer window.location
as that's what I've used since I wrote my first web page. it is more consistent.
you can also see document.location === window.location
returns true
, which clarifies that both are same.
Solution 7 - Javascript
document.location === window.location
returns true
also
document.location.constructor === window.location.constructor
is true
Note: Just tested on , Firefox 3.6, Opera 10 and IE6
Solution 8 - Javascript
Yes, they are the same. It's one of the many historical quirks in the browser JS API. Try doing:
window.location === document.location
Solution 9 - Javascript
window.location is the more reliably consistent of the two, considering older browsers.
Solution 10 - Javascript
It's rare to see the difference nowadays because html 5 don't support framesets anymore. But back at the time we have frameset, document.location would redirect only the frame in which code is being executed, and window.location would redirect the entire page.
Solution 11 - Javascript
At least in IE, it has a little difference on local file:
document.URL will return "file://C:\projects\abc\a.html"
but window.location.href will return "file:///C:/projects/abc/a.html"
One is back slash, one is forward slash.
Solution 12 - Javascript
Well yea, they are the same, but....!
window.location
is not working on some Internet Explorer browsers.
Solution 13 - Javascript
document.location.constructor === window.location.constructor
is true
.
It's because it's exactly the same object as you can see from document.location===window.location
.
So there's no need to compare the constructor or any other property.
Solution 14 - Javascript
I would say window.location
is the more reliable way of getting the current URL.
Following is the difference between the window.location
and document.url
that came in front in one of the scenarios where I was appending hash parameters in the URL and reading it later.
After adding hash parameters in the URL.
In an older browser, I was not able to get the hash parameters from the URL by using document.url
, but when I used window.location
then I was able to get the hash parameters from the URL.
So it's always better to use window.location
.
Solution 15 - Javascript
Despite of most people recommend here, that is how Google Analytics's dynamic protocol snipped looked like for ages (before they moved from ga.js to analytics.js recently):
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
More info: https://developers.google.com/analytics/devguides/collection/gajs/
In new version they used '//' so browser can automatically add protocol:
'//www.google-analytics.com/analytics.js'
So if Google prefers document.location to window.location
when they need protocol in JS, I guess they have some reasons for that.
OVERALL: I personally believe that document.location
and window.location
are the same, but if giant with biggest stats about usage of browsers like Google using document.location, I recommend to follow them.
Solution 16 - Javascript
Actually I notice a difference in chrome between both , For example if you want to do a navigation to a sandboxed frame from a child frame then you can do this just with document.location but not with window.location