Javascript 分配给document.getElementById的变量是否可在闭包外部访问？

假设在闭包中有几个变量，如下所示：

(function () {  
    var foo = document.getElementById('foo'),  
        bar = 'baz';  
 }());

还假设我有一个id为foo的html元素：

<h1 id = 'foo'>foo</h1>

然后福：

console.log(foo.innerHTML) // logs 'foo' instead of throwing reference error. Why?

为什么关闭后foo仍然可以访问

---

hear是一个jsFiddle，如果有帮助的话：

您可以添加名称空间，如下所示：

(function () {  
var foo = document.getElementById('foo'),  
    bar = 'baz';  
}(myNameSpace));

然后从封口外部使用：

console.log(myNameSpace.bar);

---

“问题”不在于闭包内部定义的

foo

变量在闭包外部可用（正如您自己在获得

bar

的引用错误时所证明的那样）；它是浏览器在全局范围内自动为所有具有

id

属性的元素创建变量，使用该

id

作为变量名

在这种情况下：

<div id="foo">text in foo</div>
<span id="aSpan">other text, in aSpan</span>

---

.

如果调用

foo

变量，这将表明问题不是变量“泄漏”，而是（早期/非常旧的IE）的遗留问题，在该IE中，id为

id的元素可以通过其
id
的名称立即在全局范围内访问；注意，我已经删除了显示赋值。因为浏览器在全局对象中添加了id为变量的元素。@DavidThomas:这似乎就是问题所在。我没有意识到这种行为。我认为这是避免在HTML标记中使用无关id属性的另一个原因。如果你能在回答中发表你的评论，我会很高兴接受它作为正确的答案。很高兴知道，但不完全是我想要的。
<div id="foo">text in foo</div>
<span id="aSpan">other text, in aSpan</span>

(function () {  
    var whatever = document.getElementById('foo'),  
        bar = 'baz';  
 }());

console.log(foo); // outputs: <div id="foo">text in foo</div>
console.log(whatever); // outputs: Uncaught ReferenceError: whatever is not defined