为什么我们不直接使用元素 ID 作为 JavaScript 中的标识符? [英] Why don't we just use element IDs as identifiers in JavaScript?

查看:22
本文介绍了为什么我们不直接使用元素 ID 作为 JavaScript 中的标识符?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用过的所有浏览器都允许通过简单地编写以下内容来访问带有 id="myDiv" 的元素:

All browsers I've come to work with allow accessing an element with id="myDiv" by simply writing:

myDiv

见这里:http://jsfiddle.net/L91q54Lt/

无论如何,这种方法的文档似乎很差,事实上,我遇到的消息来源甚至没有提及它,而是假设人们会使用

Anyway, this method seems to be quite poorly documented, and in fact, the sources I come across don't even give it a mention and instead assume that one would use

document.getElementById("myDiv")

也许

document.querySelector("#myDiv")

访问一个 DOM 元素,即使它的 ID 是预先知道的(即不是在运行时计算的).我可以说,如果有人无意中尝试在更广泛的范围内重新定义 myDiv(虽然不是一个绝妙的主意......),并用一些不同值并在没有注意到冲突的情况下继续.

to access a DOM element even when its ID is known in advance (i.e. not calculated at runtime). I can tell that the latter approaches have the advantage of keeping the code safe if someone inadvertedly attempts to redefine myDiv in a wider scope (not such a brilliant idea though...), overwrites it with some different value and goes on without noticing the clash.

但除此之外呢?除了代码设计之外,使用上面的简短形式还有什么问题吗,或者我在这里还遗漏了什么?

But other that that? Are there any concerns in using the short form above other than code design, or what else am I missing here?

推荐答案

无论如何,这种方法的文档记录似乎很差,事实上,我遇到的消息来源甚至都没有提及[...]

Anyway, this method seems to be quite poorly documented, and In fact, the sources I come across don't even give it a mention [...]

除了依赖隐式声明的全局变量之外,缺乏文档是不使用它的一个重要原因.

Reliance on implicitly-declared global variables aside, the lack of documentation is a great reason not to use it.

id 值明显提升为全局变量不符合标准(ID 属性的 HTML5 规范 没有提及它),因此,您不应该假设未来的浏览器会实现它.

The apparent promotion of id values into global variables isn't standards compliant (the HTML5 spec for the ID attribute doesn't mention it) and, therefore, you shouldn't assume future browsers will implement it.

事实证明这种行为符合标准 - 在 HTML5 中,window 应该支持对命名元素"的属性访问:

It turns out this behaviour is standards compliant - In HTML5, window should support property access to "Named Elements":

具有名称 name 的命名对象,就上述算法而言,是那些:

Named objects with the name name, for the purposes of the above algorithm, are those that are either:

  • 名称为name
  • 的活动文档的子浏览上下文
  • a、applet、area、embed、form、frameset、img 或具有值为 name
  • 的名称内容属性
  • 具有 id 内容属性的 HTML 元素,其值为 name.
  • child browsing contexts of the active document whose name is name,
  • a, applet, area, embed, form, frameset, img, or object elements that have a name content attribute whose value is name, or
  • HTML elements that have an id content attribute whose value is name.

来源:HTML 5 规范, '对窗口对象的命名访问'强调我的.

基于此,符合标准并不是避免这种模式的理由.但是,规范本身建议不要使用它:

Based on this, standards compliance is not a reason to avoid this pattern. However, the spec itself advises against its use:

作为一般规则,依赖于此会导致代码脆弱.哪个ID 最终映射到此 API 可能会随着时间的推移而变化,因为新功能正在例如,添加到 Web 平台.而不是这个,使用document.getElementById()document.querySelector().

As a general rule, relying on this will lead to brittle code. Which IDs end up mapping to this API can vary over time, as new features are added to the Web platform, for example. Instead of this, use document.getElementById() or document.querySelector().

这篇关于为什么我们不直接使用元素 ID 作为 JavaScript 中的标识符?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆