Question

我知道这不是“最佳做法”，但我很好奇为什么这段代码不起作用。作为参考，我目前正在使用Chrome 63。

到处输入getElementById是令人讨厌的。假设我有以下代码：

var D = document;
D.getID = D.getElementById;
D.getTags = D.getElementsByTags;
HTMLElement.prototype.getID = HTMLElement.prototype.getElementById;
HTMLElement.prototype.getTags = HTMLElement.prototype.getElementsByTags;

如果我尝试使用这些新名称，例如D.getID("foo").getID("bar")，然后我收到错误D.getID("foo").getID("bar") is not a function。这是怎么回事？（当然，D.getID("foo")工作得很好）

Answer 1

由于ID在文档中应该是唯一的，因此没有HTMLElement.prototype.getElementById()方法。具有此方法的唯一对象是document。

您可以通过指定绑定到HTMLElement的函数将此方法添加到document：

HTMLElement.prototype.getID = document.getElementById.bind(document);

请注意，即使您可以使用此方法从特定元素调用方法，它也会搜索整个文档，而不仅仅是在该元素中。您可以使用querySelector来限制它：

HTMLElement.prototype.getID = function(id) {
    return this.querySelector('#' + id);
}

getTags的代码只是对long方法使用了错误的名称。它应该是：

HTMLElement.prototype.getTags = HTMLElement.prototype.getElementsByTagName

D.getID和D.getTags不需要分配，因为Document继承自HTMLElement。

为HTMLElement方法添加别名，为什么这不起作用？

1 个答案: