Jquery function?

Jquery function?

本文关键字：function Jquery      更新时间：2023-09-26

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

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

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

(function($){})(jQuery)

和 

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

实际上有什么区别？

$( 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包装在一个匿名函数中，您可以在其中使用 $ 引用 jQuery 对象。

。

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

4.这与#3相同。

$(document).ready(function() {//when document is read

和 

$(function() {

是一回事，第二个只是速记

你也可以做 

$(window).load(function() {

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

(function($){})(jQuery)

是一个自执行的匿名函数

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

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

var $ = 'other plugin';
(function($){
    alert($); // jQuery here
})(jQuery);

第一个使方法在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对象，而不是来自另一个库的任何其他内容。

相关文章：