0

鉴于这两个片段：

$.ready(function()
{
     ……
}

和

(function($){
  $(function(){

    ……

  });
})(jQuery);

看来我使用第一种格式但它不起作用，所以我想知道它们之间有什么区别？

<script src="" />此外，将 放在页面底部和?之间有区别head吗？

4

3 回答 3

3

两者的区别在于第一个假设jQuery设置为变量$。第二个没有。

第二个$在沙箱中定义为函数的参数，然后传入jQuery该参数。$即使在noConflict模式下，它也是一种常用的速记方式。

(function($){  // <----- $ is defined ONLY within THIS function
  $(function(){
    ……
  });
})(jQuery);    // <------- jQuery being passed in for $
于 2013-10-03T03:28:46.603 回答
2

除其他外，不同之处在于这两者是不同的功能：

  • jQuery.ready是触发就绪事件的内部方法。它不期望函数作为参数，而是布尔值。

  • $(function)是 的快捷方式jQuery.fn.ready，它是绑定就绪事件处理程序的API 方法，即在加载 DOM 时应该运行的函数。

所以，第一个“不起作用”，因为它根本没有做你认为它做的事情。我建议阅读.ready文档。

第二个被包装在立即调用的函数表达式中的事实对功能没有影响。

<script src="" />另外，放在页面底部和头部之间有区别吗？

假设您正在谈论将处理程序绑定到就绪事件，那么不，在执行方面没有区别。

对于那些不想关注链接的人：

jQuery.ready：

// Handle when the DOM is ready
ready: function( wait ) {

    // Abort if there are pending holds or we're already ready
    if ( wait === true ? --jQuery.readyWait : jQuery.isReady ) {
        return;
    }

    // Remember that the DOM is ready
    jQuery.isReady = true;

    // If a normal DOM Ready event fired, decrement, and wait if need be
    if ( wait !== true && --jQuery.readyWait > 0 ) {
        return;
    }

    // If there are functions bound, to execute
    readyList.resolveWith( document, [ jQuery ] );

    // Trigger any bound ready events
    if ( jQuery.fn.trigger ) {
        jQuery( document ).trigger("ready").off("ready");
    }
},

jQuery.fn.ready：

ready: function( fn ) {  
    // Add the callback
    jQuery.ready.promise().done( fn );

    return this;
},
于 2013-10-03T03:35:59.637 回答
0

要回答您的最后一个问题：

将 javascript 放在页面底部可确保在执行之前加载页面的 HTML。据我所知，在页面底部包含一个 javascript 文件会将其加载顺序放在所有其他文件之后。

您提供的片段在执行上应该是相同的，尽管使用第一个更合适。第二个感觉……冗余。

于 2013-10-03T03:27:16.137 回答