如前面的答案中所述,此行为称为对窗口对象的命名访问。某些元素的属性值和所有元素的属性值都可用作全局对象的属性。这些元素称为命名元素。由于 是 浏览器中的全局对象,因此每个命名元素都可以作为全局变量进行访问。name
id
window
window
这最初是由 Internet Explorer 添加的,最终由所有其他浏览器实现,只是为了与依赖于此行为的站点兼容。有趣的是,Gecko(Firefox的渲染引擎)选择仅在quirks模式下实现它,而其他渲染引擎在标准模式下保持打开状态。
但是,从Firefox 14开始,Firefox现在也支持在标准模式下对对象进行命名访问。他们为什么要改变这一点?事实证明,仍然有很多网站在标准模式下依赖于此功能。微软甚至发布了一个营销演示,阻止了该演示在Firefox中工作。window
Webkit最近考虑了相反的情况,将对象的命名访问权限降级为仅 quirks 模式。他们通过与壁虎相同的推理决定反对它。window
所以。。。疯狂的是,似乎这种行为现在在技术上是安全的,可以在标准模式下使用所有主要浏览器的最新版本。但是,虽然命名访问似乎有点方便,但它不应该被使用。
为什么?在本文中可以总结出很多关于为什么全局变量不好的推理。简单地说,有一堆额外的全局变量会导致更多的错误。假设您不小心键入了 a 的名称,并碰巧键入了 DOM 节点的 a,SURPRISE!var
id
此外,尽管已经标准化,但在浏览器的命名访问实现中仍然存在很多差异。
- IE 错误地使表单元素(输入、选择等)可以访问属性的值。
name
- Gecko 和 Webkit 错误地没有通过它们的属性使标签可访问。
<a>
name
- Gecko 错误地处理了多个同名的命名元素(它返回对单个节点的引用,而不是对引用数组的引用)。
我敢肯定,如果您尝试在边缘情况上使用命名访问,还会有更多。
如其他答案中所述,使用 通过其 获取对 DOM 节点的引用。如果需要通过节点的属性获取对节点的引用,请使用 。document.getElementById
id
name
document.querySelectorAll
请不要通过在您的网站中使用命名访问权限来传播此问题。许多Web开发人员都浪费时间试图追踪这种神奇的行为。我们确实需要采取行动,让渲染引擎在标准模式下关闭命名访问。在短期内,它会破坏一些做坏事的网站,但从长远来看,它将有助于推动网络向前发展。
如果您有兴趣,我会在我的博客上更详细地讨论这个问题 - https://www.tjvantoll.com/2012/07/19/dom-element-references-as-global-variables/。