Question

我发现设置一个与元素id同名的变量很方便，例如：

randomDiv = document.getElementById("randomDiv");
  randomDiv.onclick = function(){ /* Whatever; */ }
  randomDiv.property = "value";

这适用于Chrome和Firefox，但不适用于IE8;提供错误 Object不支持此属性或方法。

创建一个名称与元素ID匹配错误（或不良做法）的变量，或者这是另一个Internet Explorer实例吗？

Answer 1

自动生成全局变量被认为是不好的做法，因为可能很难分辨，查看某些代码，无论是故意还是忘记在某处声明变量。自动创建像doesn’t work in ES5 strict mode这样的全局变量，并且可以在ECMAScript的未来版本中逐步淘汰。

在浏览器中 JavaScript的全局范围实际上是window 。当您引用document时，您会获得window.document。在浏览器中创建全局变量的最佳做法是将其添加到window（Node.js中的global）。这是an example from jQuery：

window.jQuery = window.$ = jQuery;

window上的某些属性（因此某些全局变量）是只读的，您无法覆盖它们。 window.document是一个（在Chrome中测试过，这是特定于浏览器的，可能会更改）：

window.document; // → Document
window.document = 'foo'; // → "foo" // It worked!
window.document; // → Document // Hmm, no it didn’t

事实证明大多数浏览器都会为文档中的每个ID在window（因此全局变量）上创建属性。许多浏览器不会将它们设置为只读，您可以使用自己的浏览器覆盖它们，但Internet Explorer会这样做。

这是JavaScript中全局变量可能存在危险的另一个原因 - 您的一个ID可能与只读window属性（今天或以后的浏览器）相匹配。

在顶层（不在函数内），var声明全局变量。在顶级说明var document = 'foo'不会引发错误，但document仍然是Document，而不是"foo"。

顺便说一句：新的浏览器（支持ES5）允许您使用Object.defineProperty创建自己的只读全局变量：

Object.defineProperty(window, 'foo', { value: 'bar', writable: false });
foo = 'baz';
foo; // → "bar"

我有三种选择。

继续使用元素的全局变量，但如果它们已经存在则保持不变（明确地在window创建它们，以便使用ES5清晰和酷炫的代码）：
```
if ( ! window.randomDiv) {
    window.randomDiv = document.getElementById('randomDiv');
}
```
在window上创建一个对象，用作应用程序自己的命名空间，不会干扰其他库或浏览器。这很常见，被认为是非常好的做法，特别是如果它需要跨JavaScript文件访问：
```
// Early in your code…
window.Fantabulum = {};
// Later on…
Fantabulum.randomDiv = document.getElementById("randomDiv");
```
避免制作全局变量。确保你的应用程序的代码在一个函数内（它应该已经是你的其他变量不是全局的，没有相同的限制！），并为你的元素声明变量：
```
(function(){
    var randomDiv = document.getElementById("randomDiv");
})();
```

Answer 2

创建与元素ID和名称同名的全局变量是IE的一个怪癖。您可以创建一个具有相同名称的全局，但是有一些怪癖。

这是一个非常糟糕的主意。如果您不喜欢输入 document.getElementById ，只需为它创建一个小包装函数，例如：

funciton get(id) {
  return typeof id == 'string'? document.getElementById(id) : id;
}

Answer 3

randomDiv不是已定义/已知的“全局范围变量”。

Declaring global variable

我可以使用ID作为变量名吗？

3 个答案: