窗和窗的区别是什么?Location和document。Location ?

窗口之间有什么区别。Location和document。Location ?它们是否都引用同一个对象?

131395 次浏览
小开

是的，它们是一样的。这是浏览器JS API的众多历史怪癖之一。试着做:

window.location === document.location
小开

document.location === window.location返回true

也

document.location.constructor === window.location.constructor是true

注:仅在Firefox 3.6、Opera 10和IE6上测试

小开
最佳答案

根据W3C的说法，它们是相同的。实际上，为了跨浏览器安全，应该使用window.location而不是document.location。

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

小开

窗口。考虑到较老的浏览器，位置是两者中更可靠的一致性。

小开

获取当前位置对象的规范方法是window.location(参见这是1996年的MSDN页面和2006年的W3C草案)。

将此与document.location进行比较，后者最初仅以字符串形式返回当前URL(参见MSDN上的此页)。可能是为了避免混淆，document.location被替换为document.URL(参见这里是MSDN)，它也是DOM级别1的一部分。

据我所知，所有现代浏览器都将document.location映射到window.location，但我仍然更喜欢window.location，因为这是我自编写第一个DHTML以来使用的。

小开

window.location在所有兼容的浏览器上都是读/写的。

document.location在Internet Explorer(至少)中是只读的，但在基于gecko的浏览器(Firefox, SeaMonkey)中是读/写的。

小开

document.location最初是一个只读属性，尽管壁虎的浏览器也允许你给它赋值。为了跨浏览器安全，请改用window.location。

阅读更多:

document.location

window.location

小开

据我所知，两者是一样的。为了跨浏览器安全，你可以使用window.location而不是document.location。

所有现代浏览器都将document.location映射到window.location，但我仍然更喜欢window.location，因为这是我写第一个网页以来使用的。它更加一致。

你还可以看到document.location === window.location返回true，这说明两者是相同的。

小开

document.location.constructor === window.location.constructor是true。

这是因为它与你从document.location===window.location中看到的对象完全相同。

因此，不需要比较构造函数或任何其他属性。

小开

有趣的是，如果你有一个名为'location'的框架、图像或窗体，那么'document. properties '则为'location . properties '。location'提供了对框架窗口、图像或窗体的引用，而不是location对象。显然，这是因为文件。表单、文档。image和window.frames集合名称查找优先于window.location的映射。

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


if (document.location.tagName == 'IMG') alert('Hello!')
小开
我会说window.location是获得当前URL的更可靠的方法。 下面是前面的window.location和document.url之间的区别，在其中一个场景中，我在URL中添加哈希参数并稍后读取它

在URL中添加散列参数后。

在一个较旧的浏览器中，我无法通过使用document.url从URL中获得哈希参数，但当我使用window.location时，我就能够从URL中获得哈希参数。

所以使用window.location总是更好。

小开

至少在IE中，它在本地文件上有一点不同:

< p >文档。URL将返回 ”文件:/ / C: \ \ abc \ a.html项目”< / p >

但是window.location.href将返回 “文件:/ / / C: /项目/ abc / a.html”< / p >

一个是反斜杠，一个是正斜杠。

小开

是的，他们是一样的，但是....!

window.location不能在某些ie浏览器上工作。

小开

现在很少能看到区别，因为html 5不再支持框架集了。但在那个时候我们有框架集，文档。Location将只重定向正在执行代码的帧和窗口。Location将重定向整个页面。

小开

尽管大多数人在这里推荐，但这就是谷歌分析的动态协议剪辑的样子(在他们最近从ga.js转移到analysis .js之前):

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

更多信息: https://developers.google.com/analytics/devguides/collection/gajs/

在新版本中，他们使用了'//'，所以浏览器可以自动添加协议:

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

因此，如果谷歌在JS中需要协议时更喜欢document.location而不是window.location，我猜他们有一些原因。

整体:我个人认为document.location和window.location是相同的，但如果giant有关于使用document.location的谷歌等浏览器使用情况的最大统计数据，我建议遵循它们。

小开

实际上，我注意到两者之间的chrome的区别，例如，如果你想做一个导航到沙盒框架从一个子框架，那么你可以这样做，只是与文档。Location，但不是window。Location

小开

我更喜欢使用document.location，尽管location， document.location和window.location返回相同的对象。

使用document.location的原因是:

  1. 浏览器兼容性章节window.location提到

在Firefox 57之前，通过URL api访问URL时，URL中包含的单引号会被转义。参见bug 1386683。

  1. 浏览器兼容性章节document.location提到

全力支持。

  1. Mdn 位置引用在他们的例子中使用了document.location。

    // location: https://developer.mozilla.org:8080/en-US/search?q=URL#search-results-close-container
const loc = document.location;
console.log(loc.href);      // https://developer.mozilla.org:8080/en-US/search?q=URL#search-results-close-container
console.log(loc.protocol);  // https:
console.log(loc.host);      // developer.mozilla.org:8080
console.log(loc.hostname);  // developer.mozilla.org
console.log(loc.port);      // 8080
console.log(loc.pathname);  // /en-US/search
console.log(loc.search);    // ?q=URL
console.log(loc.hash);      // #search-results-close-container
console.log(loc.origin);    // https://developer.mozilla.org:8080


location.assign('http://another.site') // load another page

提交答案