Хорошо. Благодаря различным ответам, в частности, от Lee .
Кажется, что метод $.extend(...) jQuery не предназначен для расширения элемента DOM от другого. Но он может расширить элемент DOM из объекта. Вот решение, чтобы сделать это:
1) Сначала я создаю объекты расширения. Каждое из этих расширений должно иметь определенный метод initExtension(). Вот пример для создания двух расширенных объектов:
var myObjExtension1 = {
// constructor
initExtension : function() {
// Add some data properties
this.something = 'something';
// Add some method properties
this.doSomething = function() { alert(this.something); };
// Add some DOM elements
$(this).append('<div>element created from extension 1</div>');
// Add some event handlers
$(this).click(
function(evt) {
$(this).append('<div>element created from extension 1 click event</div>');
}
);
}
};
var myObjExtension2 = {
// constructor
initExtension : function() {
// Add some data properties
this.more = 'more';
// Add some method properties
this.doMore = function() { alert(this.more); };
// Add some DOM elements
$(this).append('<div>element created from extension 2</div>');
// Add some event handlers
$(this).click(
function(evt) {
$(this).append('<div>element created from extension 2 click event</div>');
}
);
}
};
2) Чтобы легко расширить все элементы, которые мне нужны, я создал небольшой плагин jQuery. Этот плагин содержит один метод, расширяющий исходный элемент указанным расширением:
(function($){
$.fn.extendWith = function( objExtension ) {
this.each(
function(index) {
$.extend( this, objExtension );
this.initExtension();
}
);
return this; // jQuery chaining
}
})(jQuery);
3) Наконец, я расширяю некоторые элементы jQuery. Обратите внимание, что в следующем примере я расширяю элементы, которые соответствуют классу someElement, сначала с помощью myObjExtension1, а затем с myObjExtension2, с помощью цепочки метода плагина extendWith(...):
$('.someElement').extendWith( myObjExtension1 ).extendWith( myObjExtension2 );
Теперь все свойства данных myObjExtension1 и myObjExtension2, свойства методов и обработчики событий доступны из моих элементов $ ('. SomeElement'). Пример: * +1022 *
$('.someElement').each( function() {
this.doSomething();
this.doMore();
});