1

在编写任何 jquery 之前，他们总是建议我们使用

$( document ).ready(function() {});

并将我们所有的代码放在这个函数中，但我注意到某些教程使用它来代替

(function($){})(jQuery)

和

(function($){}(jQuery));

实际上有什么区别？

4

4 回答 4

4 
$( document ).ready(function() { YOUR CODE });

1. 此代码包装YOUR CODE在 jQuery 的文档就绪处理程序中。这可确保在您开始运行脚本之前加载所有 HTML。此外，由于YOUR CODE它是匿名函数（闭包）的一部分，因此可以保持全局范围的清洁。

...

$(function(){ YOUR CODE });

2.这和#1一样，只是使用简写。

...

(function($){ YOUR CODE })(jQuery)

3. 这不会在准备就绪的处理程序中包装任何东西，所以它会立即运行，而不管到目前为止已经加载了什么 HTML。但是，它确实包含YOUR CODE在一个匿名函数中，您可以在其中使用$.

...

(function($){ YOUR CODE }(jQuery));

4. 这与#3 相同。

于 2013-06-17T05:27:00.623 回答
2 
$(document).ready(function() {//when document is read

和

$(function() {

都是一样的，第二个只是短手

你也可以做

$(window).load(function() {

//窗口加载事件在整个页面完全加载后执行，包括所有框架、对象和图像。

(function($){})(jQuery)

是一个自执行匿名函数

所以基本上它是一个匿名函数，它可以让 jQuery 与其他可能具有 $ 变量/函数的 javascript 库很好地配合使用。此外，如果您注意到，所有 jQuery 插件代码都包含在这个匿名函数中。

于 2013-06-17T05:17:45.283 回答
0

第一个使该方法在document ready. 在这里阅读更多。

(function($){/*Your code*/})(jQuery)

最后两个将代码中的变量/函数声明封装到本地范围，作为参数获取 jQuery 对象。这种方法用于不乱扔声明的全局范围，即本地化变量。

最后两个之间的区别只是第一个用一组额外的括号来分隔函数，以使其在视觉上更清晰。

基本上，这就是在 javascript 中构建模块的方式，并确保一个代码块不会影响另一个代码块。

有关更多信息，这里有一篇关于 js 开发模式的好文章。

例子：

var f = function (str) {
   window.alert(str);
};

var name = "John Doe";

f();

功能上是一样的

(function (w) {
    var f = function (str) {
       w.alert(str);
    };

    var name = "John Doe";

    f();
})(window);

如您所见，第一个在全局范围内创建变量，这可能会影响其他脚本，而第二个在本地执行所有操作。此外，在第二个示例中，我确实将引用重命名为window，并通过w. 同样的情况也发生在您的示例中。

想象一下有两个都使用别名简写的 js 库$。你不会知道你的代码在哪里被引用。而另一方面jQuery总是引用jQuery库。在您的情况下，最后两种方法只是确保它$只是一个重命名的jQuery对象，而不是来自另一个库的任何其他内容。

于 2013-06-17T05:16:48.260 回答
0

第一个是在文档准备好后立即执行该函数，而其他的是 IIFE，以确保可以通过$该函数中的别名符号访问 jQuery：

var $ = 'other plugin';
(function($){
    alert($); // jQuery here
})(jQuery);
于 2013-06-17T05:40:20.970 回答