代码之家 › 专栏 › 技术社区 › Corey Sunwold

为什么在jquery插件中返回this.each(function())?

jquery-plugins jquery

Corey Sunwold · 技术社区 · 16 年前

我在开发jquery插件时看到的一些教程和示例倾向于返回

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

在实例化插件的函数的末尾,但我还没有看到背后的任何推理,它似乎是每个人都遵循的标准。有谁能告诉我这种做法背后的原因吗?

编辑:为了澄清我的问题不是为什么返回这个,而是为什么插件应该返回这个。

5 回复 | 直到 11 年前

Felix Kling 16 年前

使用选择器筛选元素时( $('.myclass') ,它可以匹配多个元素。
用 each ,你迭代 所有匹配元素 你的代码也适用于所有这些。

gnarf 16 年前

jquery支持“可链接方法”,这意味着最 jquery函数应该返回 this . .each() 收益率 这 ,如果你愿意 $('selector').yourPlugin().css(...) 为了工作,你应该 return this .

rubensa 11 年前

让我向您展示两个“等效”代码,它们可以澄清您的问题:

使用jquery“each”函数:

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

没有jquery“each”函数:

(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 对象(对象) 作为 这 通常是指jquery选择器返回的一组元素 )并将引用返回到 这 ( 作为 每个 函数总是返回该引用-以允许链接调用- )

作为旁注 :第二种方法( - for 回路- )比以前的浏览器更快(特别是在旧浏览器上)( - 每个 功能- )