javascript - 将原型(prototype)继承给 JavaScript 中的所有子元素

Question

我想为每个 DOM 元素添加一些函数，但我不想遍历所有元素。这是一个演示代码:

window.onload = function () {
    /* get the constructor of document, which is Document
       add the clickMe function to the prototype */
    document.constructor.prototype.clickMe = function (func) {
        this.addEventListener('click', function () {
            func();
        });
    };
    document.clickMe(clickDocument); // works

    /* doesn't work, because the prototype of document.getElementById('random_btn')
       does not have the function clickMe (makes sense) */
    document.getElementById('random_btn').clickMe(clickRandomBtn);
}

function clickDocument() {
    alert("clicked documet");
}

function clickRandomBtn() {
    alert("clicked a random button");
}

Answer 1

如果我理解你的问题，你想要这个:

Element.prototype.clickMe = function (func) {
    this.addEventListener('click', function () {
        func();
    });
};

Demonstration

但更改原生对象的原型(prototype)通常被视为一种不好的做法。参见 Maintainable JavaScript: Don’t modify objects you don’t own