getElementById和简单地使用元素的ID作为变量有什么区别？

Question

有人能告诉我调用id =“myDomObect”的HTML元素之间的区别吗？：

var myObj = document.getElementById('myDomObect');

＆

var myObj = myDomObect;

Answer 1

使用第一个表单或 jQuery等包装器。 第二种形式，

var myObj = myDomObect;

转换为

var myObj = window["myDomObect"];

这是“有效的”，因为旧的黑客将ID作为全球窗口属性暴露出来（IIRC从一开始就是一种错误），因此我们仍然很幸运20年后的行为......是的，它会起作用在最新的Chrome中。

然而，这样的速记不应该被用于多种原因：

1. 它不会像最初用“严格模式”那样工作（但它可以用于第二种形式）

2. 它不传达操作 - 即请求/获取DOM元素（通过ID）。

3. 它不适用于与窗口属性冲突的ID; 例如。 如果以这种方式访问​​， <div id=history></div>将导致“意外行为”。 （这不会影响在函数中正确使用局部var变量的getElementById代码。）

4. 当文档中存在重复的ID（它是允许的）行为没有定义; getElementById的行为已由DOM 4 编写 ： “getElementById（elementId）方法必须以树的顺序返回第一个元素[带有ID]。”

---

也可以看看：

• 带有id的DOM树元素是否成为全局变量？

Answer 2

第一个是“真正的”DOM API如何工作（另一个选项是document.querySelector("#myDomObject") ）。 二是如何浏览器已经开始实施的自动提升id d元素”，因为IDS应该是唯一的。 在“你在想什么”的转折中，这可能导致欢闹的冲突，其中与具有id的HTML元素具有相同名称的变量不优先，并且您使用的变量突然是HTML元素。