4

版本 1： 

function add(){
var a = 2;
...
...
...
}

版本 2： 

$(function(){
var ...
..
..
});

两个版本的主要区别在哪里？对于版本 2，它没有函数名称。如果它只是简单地运行函数中的代码，为什么不直接删除$function(){..};. 这真的让我感到困惑，因为如今，许多脚本都是以第 2 版的风格编写的。请帮助澄清我的困惑。

4

6 回答 6

9

示例 1 定义了一个名为 的函数add，而示例 2 只是将一个匿名函数传递给 jQuery 函数。

$(function() {...});语法是 的简写，$(document).ready(function() {...});它将一个函数作为其参数，然后在 DOM 准备好时执行该函数。这用于确保您想要在 Javascript 中使用的元素在执行代码之前确实存在。

编辑以解决以下评论：

.click()jQuery 函数有两个用途。如果您传递一个函数，那么它会创建一个额外的单击事件处理程序，该处理程序将在触发事件时运行该函数。如果您不传递函数，那么它将触发已附加到 jQuery 对象中元素的所有单击事件处理程序。所以，是的，你可以.click()在没有函数的情况下调用，但它不会做同样的事情。

您不能执行以下操作：

$(document).ready(var foo = 2;...);

因为这会给你一个语法错误。但是，您可以以通常的方式定义一个函数，然后将其传递给调用$(document).ready()：

function foo() {
     var foo = 2;
     ...
}

$(document).ready(foo);
于 2012-05-23T15:03:57.660 回答
3

示例 1 和示例 2 完全不同。jQuery IS javascript，所以函数定义是一样的。

$(function(){...只是一个简写，$(document).ready(function(){...而示例实际上正在生成一个名为 的新函数add。

您可以在函数中生成 add 函数，ready如下所示：

 $(function(){

       function add(){
            var foo = 1;               
       }

 });

jQuery 不是一种独立的新语言，其定义和语法与 javascript 不同，它是使用 javascript 的语法和定义用 javascript 编写的工具包。

将 jQuery 本身视为一个大函数，一个定义为 $ ... 的函数，因此function add(){}jquery 只是一个名为 $ 的函数function $(){}。您还可以使用与普通 javascript 函数相同的语法传递 jQuery 参数。

      function add(arg){
          //do something with arg
      }
      add('#elem');

      function $(arg){
          //do something with arg
      }
      $('#elem');

你看？jQuery 只是一个大而复杂的函数，我们可以传递多种类型的参数，并返回许多有用的工具。但是语法和定义与传统的javascript没有什么不同。

      function add(arg){
           var added = arg + 12;
           return this.alertAdded = function(){
                alert(added);
           }
      }

      add(30).alertAdded(); // will alert 42
      //vs
      $('#elem').fadeOut(); // same syntax but referring to very different functionality.

这是 jQueryish 语法的示例，它是普通的普通旧 JS。

于 2012-05-23T15:09:01.477 回答
2 
function add(){
var a = 2;
...
...
...
}

是一个简单的js函数。

$(function(){
var ...
..
..
});

是 jQuery Document.ready 的快捷方式：

$(document).ready () {};

您可能还想问：

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

这给出了一个封闭$符号 - 所以你可以使用美元。（可能已经加载了其他库）。

于 2012-05-23T15:06:37.100 回答
1

$(function(){})实际上是将函数包装在里面$(document).ready()；这样代码在加载 DOM 之前不会运行。

于 2012-05-23T15:04:00.133 回答
1

第一个版本将该函数添加到 window 命名空间，而第二个版本的范围仅在$(function(){...' 范围内，因此无法从括号外的代码访问。

于 2012-05-23T15:07:40.540 回答
1

我相信这$(function()是 jQuery 中文档加载的简写。

如果你想创建一个“jQuery 函数”，你需要这样做：

jQuery.fn.yourfunctionname = function() {
     //code in here
}

所以简而言之，你的第一个函数实际上定义了一个被调用的函数add，下一个函数是这个的简写：

$(document).ready(function(){

于 2012-05-23T15:06:14.633 回答