为什么 getElementById() 在 Elements 上不可用？答案

【问题标题】：Why isn't getElementById() available on Elements?为什么 getElementById() 在 Elements 上不可用？
【发布时间】：2019-01-18 16:44:52
【问题描述】：

大多数 DOM 查询方法在 Documents 和 Elements 上都可用。例如，

console.assert(
  document.getElementsByTagName   && document.body.getElementsByTagName &&
  document.getElementsByClassName && document.body.getElementsByClassName &&
  document.querySelector          && document.body.querySelector &&
  document.querySelectorAll       && document.body.querySelectorAll
);

但是，getElementById 仅适用于 Document：

console.assert(document.getElementById);
console.assert(document.body.getElementById == undefined);

为什么会这样？

WHATWG DOM 生活标准tells us that：

Web 兼容性防止 getElementById() 方法暴露在元素上

W3C DOM4 推荐 is a bit more specific:

getElementById() 方法不适用于与旧版本 jQuery 兼容的元素。如果某个版本的 jQuery 消失了，我们也许可以支持它。

但是，我仍然很难理解问题可能是什么。这种方法的存在如何对 jQuery 或其他库的行为产生不利影响？

我尝试查看旧版本的 jQuery（例如 1.0.0 和 1.7.0），看看他们对 getElementById 的任何使用是否暗示了为什么这可能是一个问题。我看到getElementById 曾经在一些较旧的浏览器中存在错误，但他们检测到这一点并转而使用可靠的手动实现。我看不到任何可以在元素上调用它并导致错误的地方。这种兼容性问题从何而来？

【问题讨论】：

因为 id 值在整个文档中必须是唯一的，这有什么意义呢？
可能只有一个元素，但我可能只对它存在于文档的特定子树中感兴趣。
@Pointy 我已经引用了这两个规范的兼容性问题，所以告诉我这是因为它毫无意义似乎不正确。
我不知道旧版本的 jQuery 如何或为什么会引起规范委员会的关注。
@Pointy：因为引入Element#getElementById 会破坏使用该版本 jQuery 的现有网站，至少在 2013 年显然已广泛部署。

标签： javascript jquery dom compatibility specifications

【解决方案1】：

https://github.com/w3c/dom 的 master 分支上的 git blame 指向：

提交f71d7de304e1ee25573279157dd6ce1c2aa2c4f2
作者：安妮·范·凯斯特伦
作者日期：2013 年 11 月 26 日星期二 13:53:41 +0000
提交：Anne van Kesteren
提交日期：2013 年 11 月 26 日星期二 13:53:41 +0000

从 Element 中移除 getElementById。 https://www.w3.org/Bugs/Public/show_bug.cgi?id=23860

链接的错误描述了 jQuery 1.2.5 + 1.2.6 (1.2.x?) 是如何受到影响的：

jQuery 1.2.5 假定它在 DOM 中找到的任何具有“getElementById”属性的节点都是 Document 节点。见https://bugzilla.mozilla.org/show_bug.cgi?id=933193#c17

【讨论】：

Jquery 应该有其他东西来检查对象是否是 Document 节点。
@RaymondPeng：现在可以了，但网站并没有全部升级。流行软件造成的错误会持续很长时间。

【解决方案2】：

正如其他人在 cmets 中所说，元素 ID 应该是唯一的。不需要在元素上使用getElementById 方法。

根据MDN's article on getElementById：

因为 ID 值在整个文档中必须是唯一的，所以不需要函数的“本地”版本。

getElementsByName也是如此

【讨论】：

但 getElementsByName 仅适用于 document，而不适用于元素。我相信最初的意图是名称是唯一的，并且使用我们现在使用 ID 的方式。这可以解释旧版本的 jQuery 解决的一些浏览器错误

【解决方案3】：

让您的所有 ID 都是独一无二的，真的会让您的生活更轻松。

【讨论】：