Javascript ID为的DOM树元素是否成为全局变量？_Javascript_Dom_Global Variables_Getelementbyid_Identifier

Javascript ID为的DOM树元素是否成为全局变量？

javascript dom

Javascript ID为的DOM树元素是否成为全局变量？,javascript,dom,global-variables,getelementbyid,identifier,Javascript,Dom,Global Variables,Getelementbyid,Identifier,在构思一个简单的HtmleElement包装器时，我偶然发现InternetExplorer和：对于DOM树中ID为的给定HtmleElement，可以使用其ID作为变量名检索div。所以对于一个像 <div id="example">some text</div> 或那么，这是否意味着DOM树中的每个元素都转换为全局名称空间中的变量？这是否也意味着可以在这些浏览器中使用它来替代getElementById方法？在这些情况下，您应该坚持使用getElementByI

在构思一个简单的HtmleElement包装器时，我偶然发现InternetExplorer和：

对于DOM树中ID为的给定HtmleElement，可以使用其ID作为变量名检索div。所以对于一个像

<div id="example">some text</div>

或

那么，这是否意味着DOM树中的每个元素都转换为全局名称空间中的变量？这是否也意味着可以在这些浏览器中使用它来替代getElementById方法？

在这些情况下，您应该坚持使用getElementById，例如：

document.getElementById('example').innerHTML

IE喜欢在全局名称空间中混合具有name和ID属性的元素，因此最好明确说明您试图获取的内容。

在这些情况下，您应该坚持使用getElementById，例如：

document.getElementById('example').innerHTML

IE喜欢在全局名称空间中混合具有name和ID属性的元素，因此最好明确说明您试图获取的内容。

应该发生的是，“命名元素”被添加为文档对象的明显属性。这是一个非常糟糕的想法，因为它允许元素名称和文档的真实属性冲突

IE还添加了命名元素作为窗口对象的属性，从而使情况变得更糟。更糟糕的是，现在您必须避免以文档或窗口对象的任何成员或项目中的任何其他库代码命名元素

这也意味着这些元素作为全局变量可见。幸运的是，在这种情况下，代码中的任何真正的全局变量或函数声明都会隐藏它们，因此您不必担心在这里命名，但是如果您尝试使用冲突的名称对全局变量进行赋值，而忘记将其声明为var，那么在IE尝试将值赋值给元素本身时，您将在IE中遇到错误

通常认为，忽略var以及依赖于在窗口或全局上可见的命名元素是不好的做法。坚持使用document.getElementById，它得到了更广泛的支持，并且不那么模棱两可。如果您不喜欢键入，可以用较短的名称编写一个简单的包装函数。无论哪种方式，使用id到元素的查找缓存都没有意义，因为浏览器通常会优化getElementById调用以使用快速查找；当元素更改id或从文档中添加/删除时，您只会遇到问题

Opera复制了IE，然后加入了WebKit，现在，以前不规范的将命名元素放在文档属性上的做法，以及以前IE唯一将命名元素放在窗口上的做法都是通过HTML5实现的，HTML5的方法是记录和标准化浏览器作者对我们造成的每一种可怕的行为，让他们永远成为网络的一部分。所以Firefox4也支持这一点

什么是“命名元素”？任何具有id的对象，以及任何具有用于“标识”目的的名称的对象：即表单、图像、锚和其他一些对象，但不包括名称属性的其他不相关实例，如表单输入字段中的控件名称、中的参数名称或中的元数据类型识别“名称”是应该避免使用id的名称。

应该发生的是，“命名元素”被添加为文档对象的明显属性。这是一个非常糟糕的想法，因为它允许元素名称和文档的真实属性冲突

Opera复制了IE，然后WebKit加入，现在，以前不标准的将命名元素放在文档属性上的做法，以及以前IE唯一的将命名元素放在窗口上的做法都是通过HTML5实现的，HTML5的方法是记录和编辑文档标准化浏览器作者强加给我们的每一个可怕的行为，使他们永远成为网络的一部分。所以Firefox4也支持这一点

什么是“命名元素”？任何具有id的对象，以及任何具有用于“标识”目的的名称的对象：即表单、图像、锚和其他一些对象，但不包括名称属性的其他不相关实例，如表单输入字段中的控件名称、中的参数名称或中的元数据类型识别“姓名”应该避免使用id。

如前面的答案所述，这种行为称为。某些元素的name属性值和所有元素的id属性值作为全局窗口对象的属性提供。这些元素称为命名元素。由于window是浏览器中的全局对象，因此每个命名元素都可以作为全局变量访问

这最初是由Internet Explorer添加的，最终由所有其他浏览器实现，只是为了与依赖于此行为的站点兼容。有趣的是，Gecko Firefox的渲染引擎选择仅在中实现此功能，而其他渲染引擎将其保持在标准模式

但是，从Firefox 14开始，Windows对象也将以标准模式运行。他们为什么要改变这一点？事实证明，仍然有很多网站在标准模式下依赖此功能。微软甚至做到了这一点，阻止了该演示在Firefox中运行

Webkit最近已将窗口对象的命名访问权限降级为仅限quirks模式。他们以和壁虎一样的理由反对它

所以…疯狂的是，在标准模式下，在所有主流浏览器的最新版本中使用这种行为在技术上是安全的。但是，尽管命名访问看起来有点方便，但不应该使用它

为什么?？在这篇文章中可以总结出许多关于原因的推理。简单地说，拥有一堆额外的全局变量会导致更多的bug。假设您意外地键入了一个var的名称，并且碰巧键入了一个DOM节点的id，这让人大吃一惊

此外，尽管已经标准化，但在浏览器的命名访问实现中仍然存在相当多的差异

IE错误地使表单元素输入、选择等可以访问name属性的值。

Gecko和Webkit不正确。正如前面的回答中提到的，这种行为称为。某些元素的name属性值和所有元素的id属性值作为全局窗口对象的属性提供。这些元素称为命名元素。由于window是浏览器中的全局对象，因此每个命名元素都可以作为全局变量访问

Webkit最近已将窗口对象的命名访问权限降级为仅限quirks模式。他们以和壁虎一样的理由反对它

此外，尽管已经标准化，但在浏览器的命名访问实现中仍然存在相当多的差异

IE错误地使表单元素输入、选择等可以访问name属性的值。 Gecko和Webkit不正确地制造。是的，它们制造了

在Chrome 55、Firefox 50、IE 11、IE Edge 14和Safari 10中测试以下面的例子：

<!DOCTYPE html>
<html>
<head>
</head>
<body>
  <div id="im_not_particularly_happy_with_that">
    Hello World!
  </div>
  <script>
    im_not_particularly_happy_with_that.innerText = 'Hello Internet!';
  </script>
  <!-- Looking at you W3 HTML5 spec group ಠ_ಠ -->
</body>
</html>

是的，有

在Chrome 55、Firefox 50、IE 11、IE Edge 14和Safari 10中测试以下面的例子：

<!DOCTYPE html>
<html>
<head>
</head>
<body>
  <div id="im_not_particularly_happy_with_that">
    Hello World!
  </div>
  <script>
    im_not_particularly_happy_with_that.innerText = 'Hello Internet!';
  </script>
  <!-- Looking at you W3 HTML5 spec group ಠ_ಠ -->
</body>
</html>

这个问题听起来应该是：提供ID的HTML标记是否成为全局可访问的DOM元素

答案是肯定的

这就是它的工作原理，也是为什么W3C从一开始就引入IDs的原因已解析脚本环境中HTML标记的ID将成为其相应的DOM元素句柄

然而，Netscape Mozilla拒绝服从他们入侵W3C并顽固地保留usi 取消不推荐使用的Name属性以造成严重破坏，从而破坏W3C引入唯一ID带来的脚本功能和编码便利性

在Netscape Navigator 4.7惨败之后，他们的开发人员都潜入了W3C，而他们的同事则用错误的实践和误用示例取代了Web。强制使用已重用的名称属性（并不是唯一的）与ID属性相配，以便利用ID处理访问特定DOM元素的脚本将简单地中断！p> 他们也会编写和发布大量的编码课程和示例[他们的浏览器无论如何都不会识别]例如document.all.ElementID.property而不是ElementID.property，以至少使其效率低下，并为浏览器提供更多开销，以防浏览器不只是在HTML域中使用相同的标记（现在[1996-97]，不推荐使用的名称和提供相同标记值的标准ID属性）来破坏它

他们很容易地说服了当时大量无知的代码编写爱好者，他们相信名称和ID实际上是一样的，只是ID属性更短，因此节省字节，而且对编码人员来说比古老的名称属性更方便。这当然是个谎言。或者-在他们取代已发表的HTML文章中，说服文章您需要为标记提供名称和ID，以便脚本引擎可以访问它们

马赛克杀手（代号Mozilla）非常愤怒，他们认为如果我们倒下，互联网也应该倒下

另一方面，正在崛起的微软太天真了，他们认为应该保留不推荐的标记为删除的名称属性，并将其视为一个唯一标识符的ID，这样他们就不会破坏Netscape受训人员编写的旧页面的脚本功能。他们大错特错了

返回ID冲突元素的数组集合也不能解决这一人为问题。实际上，它挫败了整个目的

这就是W3C变得丑陋的唯一原因，它给了我们诸如document.getElementById和随之而来的洛可可式讨厌的语法之类的白痴。。。

…

这个问题听起来应该是：：提供ID的HTML标记是否成为全局可访问的DOM元素

答案是肯定的

这就是它的工作原理，也是为什么W3C从一开始就引入IDs的原因已解析脚本环境中HTML标记的ID将成为其相应的DOM元素句柄

然而，Netscape Mozilla拒绝遵从它们入侵W3C，并顽固地使用不推荐使用的名称属性来制造混乱，因此破坏了W3C引入独特ID带来的脚本功能和编码便利性

马赛克杀手（代号Mozilla）非常愤怒，他们认为如果我们倒下，互联网也应该倒下

返回ID冲突元素的数组集合也不能解决这一人为问题。实际上，它挫败了整个目的

这也是W3C变得丑陋并给我们提供i的唯一原因像document.getElementById和伴随的洛可可式讨厌的语法之类的词汇。。。

…

使用name的一个例外是，name属性在表单提交的键值对中起着关键作用。仅供参考，Firefox仅在进入“怪癖”模式时才这样做。@yahelc:这正是我所做的区别。“不是像表单输入字段中的控件名这样的名称的其他用法…”并且作为注释，元元素不被认为是用于此目的的命名元素。多么武断……为什么！？我们能做些什么来阻止这种疯狂？我的函数通过引用元素重新定义，调试花了我一个小时应避免使用name的一个例外情况是，name属性在表单提交的键值对中起着关键作用。仅供参考，Firefox仅在进入“怪癖”模式时才这样做。@yahelc：这正是我所做的区别。“不是像表单输入字段中的控件名这样的名称的其他用法…”并且作为注释，元元素不被认为是用于此目的的命名元素。多么武断……为什么！？我们能做些什么来阻止这种疯狂？我的函数通过引用元素重新定义，调试花了我一个小时另请参见为什么不应使用此项，以及它是如何规范的。@Bergi，该评论指出，不这样做现在已经过时，甚至无效。因此，我找不到不使用此功能的具体原因。@EdmundReed您可能想再次阅读链接问题的答案-这仍然是一个坏主意：隐式声明的全局变量有坏到没有工具支持，并导致代码脆弱。不要把它称为功能，下面的答案解释了为什么它只是出于兼容性原因而成为标准的一部分。@Bergi很公平，你是对的。尽管如此，我仍然认为这是一个非常好的特性，并且仅仅因为人们没有意识到这一点而被认为是有问题的。这就是我对如何使用它的设想：@EdmundReed当然，如果你不正确地将内容和逻辑分开，问题就会少一些。另外，我建议永远不要使用内联事件处理程序，也不要在DOM元素上安装自定义方法，因为名称空间会滥用它们。注意，这不是一个作用域。另请参见为什么不应该使用它，以及它是如何规范的。@Bergi，该注释指出不这样做现在已经过时，甚至无效。因此，我找不到不使用此功能的具体原因。@EdmundReed您可能想再次阅读链接问题的答案-这仍然是一个坏主意：隐式声明的全局变量有坏到没有工具支持，并导致代码脆弱。不要把它称为功能，下面的答案解释了为什么它只是出于兼容性原因而成为标准的一部分。@Bergi很公平，你是对的。尽管如此，我仍然认为这是一个非常好的特性，并且仅仅因为人们没有意识到这一点而被认为是有问题的。这就是我对如何使用它的设想：@EdmundReed当然，如果你不正确地将内容和逻辑分开，问题就会少一些。另外，我建议永远不要使用内联事件处理程序，也不要在DOM元素上安装自定义方法，因为名称空间会滥用它们。注意，这不是一个作用域。只是对不应该使用它这一前提的明显警告的一个注记。也就是说，除非你碰巧是一个代码牛仔，否则不应该使用它。“代码牛仔”就是这样。@jeremyfoster除非“代码牛仔”是指使用和传播不友好的开发人员实现的人，否则我强烈反对。一个好牛仔的一个标志就是很多人不同意。但是现在我就像一个哲学牛仔或者类似的东西。更多的人应该在访问DOM时使用document.querySelector all和document.querySelector+我建议你使用它。通过选择器访问元素肯定是一个更有效的过程。只是对不应该使用选择器这一前提的明显警告的一个注释。也就是说，除非你碰巧是一个代码牛仔，否则不应该使用它。“代码牛仔”就是这样。@jeremyfoster除非“代码牛仔”是指使用和传播不友好的开发人员实现的人，否则我强烈反对。一个好牛仔的一个标志就是很多人不同意。但是现在我就像一个哲学牛仔或者类似的东西。更多的人应该在访问DOM时使用document.querySelector all和document.querySelector+我建议你使用它。通过选择器访问元素肯定是一个更有效的过程。在Opera中也是如此。然而，我认为在这一页上表达的对这种机制的反对意见得到了很好的采纳。在Opera中也是如此。不过，我认为本页对这一机制表示的反对意见得到了很好的采纳。