Подтвердить что ты не робот

В Javascript вы можете расширить DOM?

В Javascript вы можете расширить существующие классы, используя свой объект-прототип:

String.prototype.getFirstLetter = function() {
    return this[0];
};

Можно ли использовать этот метод для расширения элементов DOM?

4b9b3361

Ответ 1

вы можете расширить DOM с помощью прототипа элемента. Однако это не работает в IE7 и ранее. Вам нужно будет расширить конкретный элемент, по одному за раз. Библиотека Prototype делает это. Я рекомендую просмотреть , чтобы увидеть, как именно это делается.

Ответ 2

Я нашел ответ так же, как я писал вопрос, но подумал, что я бы опубликовал сообщение, чтобы поделиться информацией.

Объект, который вам нужно расширить, Element.prototype.

Element.prototype.getMyId = function() {
    return this.id;
};

Ответ 3

Вы не должны напрямую расширять что-либо ( "что-нибудь", я имею в виду локальные объекты DOM), что приведет только к плохим вещам. Плюс повторное расширение каждого нового элемента (что-то, что вам нужно сделать для поддержки IE) добавляет дополнительные накладные расходы.

Почему бы не воспользоваться подходом jQuery и не создать оболочку/конструктор, а вместо этого расширить это:

var myDOM = (function(){
    var myDOM = function(elems){
            return new MyDOMConstruct(elems);
        },
        MyDOMConstruct = function(elems) {
            this.collection = elems[1] ? Array.prototype.slice.call(elems) : [elems];
            return this;
        };
    myDOM.fn = MyDOMConstruct.prototype = {
        forEach : function(fn) {
            var elems = this.collection;
            for (var i = 0, l = elems.length; i < l; i++) {
                fn( elems[i], i );
            }
            return this;
        },
        addStyles : function(styles) {
            var elems = this.collection;
            for (var i = 0, l = elems.length; i < l; i++) {
                for (var prop in styles) {
                    elems[i].style[prop] = styles[prop];
                }
            }
            return this;
        }
    };
    return myDOM;
})();

Затем вы можете добавить свои собственные методы с помощью myDOM.fn... И вы можете использовать его следующим образом:

myDOM(document.getElementsByTagName('*')).forEach(function(elem){
    myDOM(elem).addStyles({
        color: 'red',
        backgroundColor : 'blue'
    });
});

Ответ 4

Да, вы можете, но настоятельно не рекомендуется.

Если вы переопределяете что-то, что другая библиотека ожидает, что оригинал или другая библиотека перезаписывали то, что вы ожидали.. хаос!

Лучше всего хранить свой код в собственном пространстве имен/области.