我知道这里的全局 jQuery 作为 $ 传递给函数有什么区别,
(function($){
})(jQuery);
和这个
$(function(){
})();
我知道这里的全局 jQuery 作为 $ 传递给函数有什么区别,
(function($){
})(jQuery);
和这个
$(function(){
})();
第二种不是常见的模式(它会引发类型错误),除非您错误地包含了调用括号:
(function($){
// Normal IIFE that happens to pass jQuery in as an argument
})(jQuery);
$(function(){
// Shorthand DOM-ready event handler
}); // <-- Remove the invoking parentheses
$(function(){
});
这只是 DOM-ready 事件处理程序的简写,相当于:
$(document).ready(function(){
// execution when DOM is loaded...
});
现在结束这个:
(function($){
// code here
})(jQuery);
此代码不会在 DOM 就绪时执行,但会直接执行。将 jQuery 作为参数传递给函数的好处是避免与美元符号 ( $
) 的使用发生冲突,因为多个库将其用作速记引用。函数内的所有内容都可以安全使用$
,因为这是作为对jQuery
.
阅读有关$
符号冲突的更多信息:jQuery noConflict
如果你结合这两个代码片段,你会得到一个很好的和可靠的设置:
// $ reference is unsafe here in the global scope if you use multiple libraries
(function($){
// $ is a reference to jQuery here, passed in as argument
$(function(){
// executed on dom-ready
});
})(jQuery);
PS:因为function
在 JavaScript 中既可以是语句也可以是表达式,取决于上下文,大多数人在它周围添加额外的括号以强制它成为表达式。
第一个片段将在 js 解析器遇到它时执行“function($){...}”,在其中创建一种私有上下文,其中 $ 参数 var 将指向 jQuery,因为它作为参数“(jQuery)”传递(如果你想避免与先前声明的 $ var 发生任何冲突,它会引用 jQuery 对象以外的东西,这很有用)
第二个看起来像 JQuery.ready 函数调用,但有语法错误。实际上有两种写法
$(document).ready(function(){
/* DOM has loaded */
});
$(function(){
/* DOM has loaded */
});
(function ($)
})(jQuery);
它是一个被定义的函数,然后立即调用,其中 JQuery 对象作为参数传入。$ 是对 JQuery 的引用,您可以在函数内部使用它。这相当于:
var Test = function ($){};
Test(jQuery);
和这个:
$(function (){
});
是对 JQuery 的调用,传入一个函数,一旦文档完成加载,它应该执行该函数。