浅析jQuery(function(){})与(function(){})(jQuery)之间的区别

下面我将详细讲解“浅析jQuery(function(){})与(function(){})(jQuery)之间的区别”。

1. jQuery(function(){}) 的详解

在使用 jQuery 开发时，为了保证 DOM 操作能够在 DOM 完全加载完毕后再执行，我们常常使用 jQuery 中的 DOM 就绪函数 $(document).ready() 来处理函数，因为 jQuery 函数的目的就是为了在 DOM 加载完毕后执行相应的操作。

而 jQuery(function(){}) 就是 $(document).ready() 的简写形式，它用来确保 DOM 加载完毕后执行相应的操作。

jQuery(function(){
// 在该函数中执行相应的操作，通常都是针对 DOM 操作的，如：
$('p').addClass('red');
});

jQuery(function(){}) 的特点就是使用了 jQuery 就绪函数 $(document).ready()，确保 DOM 加载完毕后执行相应的操作。

(function(){})(jQuery) 这种写法通常用来对 jQuery 进行插件式开发。

(function($){
// 在该函数中对 jQuery 进行相应的操作，如：
$.fn.pluginName = function(){
// 这里是插件的逻辑代码
}
})(jQuery);

(function(){})(jQuery) 的特点就是将 jQuery 作为一个参数传递进去，用来进行插件式开发，在插件内部可以直接使用 $ 或 jQuery 来进行操作。

虽然 jQuery(function(){}) 和 (function(){})(jQuery) 看起来很相似，但它们实际上是有很大区别的。

相同点：二者都使用了 jQuery，都可以在 DOM 加载完成后执行相应的操作。
不同点：jQuery(function(){}) 是 jQuery 提供的就绪函数，用来确保 DOM 加载完成后执行相应的操作；而 (function(){})(jQuery) 则是用来进行插件式开发的，用于将 jQuery 作为参数传递进去，在插件内部使用 $ 或 jQuery 进行操作。

示例一：

jQuery(function(){
$('p').addClass('red');
});

上面的代码使用了 jQuery(function(){})，当 DOM 加载完毕后，会往文档中的所有段落添加一个 red 的 class，用于改变样式。

示例二：

(function($){
$.fn.pluginName = function(){
this.addClass('green');
}
})(jQuery);

上面的代码使用了 (function(){})(jQuery)，用于扩展 jQuery，并为其添加一个名为 pluginName 的新方法，在该方法中添加 green 类名，用于改变样式。

这两个示例表明，jQuery(function(){}) 和 (function(){})(jQuery) 主要应用在不同的场景中，它们的区别在于前者是针对 DOM 操作使用，而后者则是针对 jQuery 的插件式开发。

本站文章如无特殊说明，均为本站原创，如若转载，请注明出处：浅析jQuery(function(){})与(function(){})(jQuery)之间的区别 - Python技术站