javascript - 是否可以向 DOM 文档添加方法？

Question

我正在开发一个函数来在另一个元素标识符中查找特定元素（类似于 getElementById 但适用于任何其他元素）......因为这会引发我的错误：

var ancestor = document.getElementById('divAncestor');
var child = ancestor.getElementById('divChild');

我知道，HTML 规定 id 必须是唯一的，但事实证明，经常运行的脚本可以包含具有相同 id 的项目。所以，这就是为什么我不只是这样称呼孩子的原因：

var ancestor = document.getElementById('divChild');

第一个选项是将此函数添加到每个 HTML 元素，或者至少是 div（因为这是我感兴趣的内容）。第二个，也是我更喜欢的一个，是向 dom 文档添加一个方法，并通过传递父子 ID 作为参数从那里调用。

这可能吗？

谢谢你的时间。

score 2 · Accepted Answer

用这个：

document.querySelector("div#divAncestor div#divChild");

这是divwithid="divChild"中的第一个divwithid="divAncestor"

虽然 ID必须是唯一的，但根据规范，它们确实有可能不是。
^{（浏览器处理得很好）}
虽然您“应该”优先防止这种情况，但上面的代码有效。

如果有多个祖先或孩子，这应该工作：

document.querySelectorAll("div#divAncestor div#divChild");

这些 querySelector 像 CSS 选择器一样工作。选择类，如：div.className，多个元素，如：div, p, h1等。

score 1 · Accepted Answer

不讨论具有非唯一 ID 的 bosh，我将回答您的实际问题：

是否可以向 DOM 文档添加方法？

是的，请参阅如何使用 JS 扩展 DOM。但不要这样做！Kangax 的文章What's wrong with extends DOM中很好地讨论了这些原因。

第二种方法是在 dom 文档中添加一个方法，并通过传递父子 ID 作为参数从那里调用。

你可以这样做，是的，不会造成太大的伤害。我猜它在所有浏览器中都能正常工作，因为无论如何使用静态函数你都不会遇到垃圾收集问题等。

然而，我看不出这样做的充分理由。在我看来，这就像滥用document变量作为命名空间，而任何其他全局变量或命名空间对象也会这样做。为了不创建可能的（未来）冲突，专用命名空间将是更好的选择。

2 回答 2