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

Зачем возвращать this.each(function()) в плагинах jQuery?

Некоторые из обучающих программ и примеров, которые я видел для разработки плагинов jQuery, как правило, возвращают

this.each(function () {
    //Plugin code here
});

в конце функции, которая создает экземпляр плагина, но я еще не видел никаких аргументов позади этого, он просто кажется стандартом, которым следуют все. Может ли кто-нибудь просветить меня относительно рассуждений, лежащих в основе этой практики?

Изменить: для разъяснения мой вопрос был не в том, почему вернуть это, а в том, почему плагин должен вернуть this.each.

4b9b3361

Ответ 1

При фильтрации элементов с помощью селектора ($('.myclass')) он может соответствовать более чем одному элементу.
С помощью each вы перебираете все согласованные элементы, и ваш код применяется ко всем из них.

Ответ 2

jQuery поддерживает "цепные методы", что означает, что большинство функций jQuery должны возвращать this. .each() возвращает this, и если вы хотите, чтобы $('selector').yourPlugin().css(...) работал, вы должны return this.

Ответ 3

Когда вы пишете плагин, вы расширяете объект jQuery и потому, что объект jQuery является последовательностью, вы возвращаете this.each(function () { });, чтобы ваш плагин выполнялся для каждого элемента последовательности.

Ответ 4

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

Функция jQuery "каждая":

(function($) {
    $.fn.mangle = function(options) {
        return this.each(function() {
            $(this).append(' - ' + $(this).data('x'));
        });
    };
})(jQuery);

Без jQuery "каждая" функция:

(function($) {
    $.fn.mangle = function(options) {
        var objs = this;
        for (var i=0; i<objs.length; i++) {
            var obj = objs[i];
            $(obj).append(' - ' + $(obj).data('x'));
        };
        return this;
    };
})(jQuery);

Итак, в основном, функция each используется для применения некоторого кода ко всем элементам, содержащимся в объекте this (поскольку this обычно относится к группе элементов, возвращаемых селектором jQuery) и возвращает ссылку на this (поскольку функция each всегда возвращает эту ссылку - чтобы вызвать цепочку вызовов -)

В качестве побочного примечания: второй подход (- for loop-) выполняется быстрее (особенно в старых браузерах), чем предыдущий (- each function -).

Ответ 5

Короче говоря, это позволяет вам использовать цепочку, так как возвращает все, что было сделано до сих пор, так что следующий .anyMethod() может воздействовать на измененные/измененные элементы.



Кроме того, взгляните на эти ссылки, они дадут вам много информации о разработке плагина jQuery.

http://www.webresourcesdepot.com/jquery-plugin-development-10-tutorials-to-get-started/
http://www.learningjquery.com/2007/10/a-plugin-development-pattern
http://snook.ca/archives/javascript/jquery_plugin

И здесь у вас есть хорошее веб-приложение, которое поможет вам запустить плагины jQuery. http://starter.pixelgraphics.us/