45

我已经看到了 ready() 方法的一些快捷方式,并且想知道实际上哪个先发生,因为我的测试结果让我感到困惑..

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

$(window).load(function(){
    alert("window ready");
});

(function($){
    alert("self invoke");
})(jQuery);

这里自调用首先发生,然后是文档,然后是窗口。自调用技术是否被视为ready()方法?

4

3 回答 3

102

第三个选项不是.ready()(或真正与 jQuery 相关的)的快捷方式,自我调用会立即运行(只要它出现在代码中),可能是您正在考虑的快捷方式:

$(function(){
  alert("I'm a ready shortcut");
});

将函数传入$(func)$(document).ready(func);. 无冲突版本如下所示:

jQuery(function($) {
  //$ is jQuery
});
于 2010-10-11T15:16:48.643 回答
13

Nick Craver 的说法是正确的,但我认为值得注意的是,在最后一个示例中,它实际上并没有对 jquery 做任何事情。jQuery 被作为参数传递给匿名函数,但该函数没有对它做任何事情。

最后一个示例等价于立即调用函数表达式 (IIFE):

(function(){
    alert("self invoke");
})();

显然,这只是在命中该行代码并因此发出警报时立即调用匿名函数。它根本没有调用 jQuery,这就是为什么 Nick 说它肯定不是 ready() 方法时是对的。

于 2010-10-11T15:21:57.227 回答
6

本文很好地解释了前两者的不同之处:

$(document).ready对比$(window).load

jQuery 提供了两种强大的方法来执行代码和附加事件处理程序:$(document).ready$(window).load. 当 HTML 文档被加载并且 DOM 准备就绪时,文档就绪事件已经执行,即使所有的图形还没有加载。如果您想在窗口加载之前为某些元素关联事件,那么 $(document).ready这是正确的地方。

$(document).ready(function() {
  // executes when HTML-Document is loaded and DOM is ready
  alert("document is ready");
});

窗口加载事件在整个页面完全加载后执行,包括所有框架、对象和图像。因此,涉及图像或其他页面内容的函数应放置在窗口或内容标签本身的加载事件中。

$(window).load(function() {
  // executes when complete page is fully loaded, 
  // including all frames, objects and images
  alert("window is loaded");
});
于 2010-10-11T15:27:26.327 回答