Question

我有一个jQuery插件缩小并位于脚本的最底部，其中一个函数在脚本页面加载的中间某处调用。

现在方法1生成错误，请参阅以下简化代码

//method 1: red is not a function!
/*
(function($) {
    $("#foo").red();
})(jQuery);
*/

// method 2: this works
jQuery(function() {
    $("#foo").red();
});

// plugin
(function($) {
    $.fn.red = function() {
        return $(this).css("color", "red");
    };
})(jQuery);

有人可以解释这两种方法之间的区别吗？导致方法1错误的原因是什么？

Answer 1

两者之间的主要区别在于第二个等待DOM准备好用以下代码包装代码：

$(function(){
    // code in here will be executed once the DOM is ready
});

因此插件有时间注册自己＆＃34;因此，您不会收到错误消息，指出red不是函数。

如果您希望第一个版本等待DOM准备就绪，请使用：

(function($) { // $ is jQuery, prevents name collision with other frameworks
    $(function(){ // Register the code to fire after the DOM is ready
        $("#foo").red();
    });
})(jQuery); // Passes jQuery as a parameter so $ will be jQuery

作为旁注，在加载jQuery之后立即注册所有插件，所有这些问题都会消失。

（function（$）{}）（jQuery）和jQuery（function（）{}）之间的区别;

1 个答案: