Javascript "undefined" 变量获取匹配的 HTML 对象

Question

我有点困惑。假设我有以下HTML代码：

<div id="foo"></div>

如果我写这个：

var bar = foo;
console.log(bar);

然后我将得到这个作为输出——令人惊讶的是，具有"foo"ID:的DOM元素

<div id="foo"></div>    // Chrome
[object HTMLDivElement] // FireFox

这种行为有什么具体的原因吗？或者我的设置有问题？其他人也能复制这个吗？如果这是一种正确的行为，我们应该在何时以及如何使用它？

更新

我看到这里有一个类似的问题，但并不是所有的问题都得到了回答。我看到的答案大多是关于IE特定的事情，这不是真的——至少现在是这样。

JSFiddle

Answer 1

因为每个命名元素都成为window对象的全局属性。

因此，如果你给一个元素一个id，那么你可以通过window对象和访问它

<div id="foo"></div>

对于上面的元素，你可以写这个

console.log(foo);

相当于

console.log(window.foo);