jQuery的ready（）方法的快捷方式

Question

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

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

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

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

这里首先发生自我调用，然后是文档，然后是窗口。 自调用技术是否被视为 ready（）方法？

Answer 1

第三个选项不是.ready()（或jQuery真正相关）的快捷方式，自我调用立即运行（一旦它出现在代码中）， this 可能是你想到的捷径：

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

将函数传递到$(func)是$(document).ready(func);的快捷方式。 no-conflict版本如下所示：

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

Answer 2

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

最后一个例子相当于：

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

显然，只要该代码行被命中，就会立即调用匿名函数，从而进行警报。它根本不是在调用jQuery，这就是为什么Nick说得对，因为他说它绝对不是ready（）方法。

Answer 3

This article对前两者的不同有很好的解释：

  

$(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");
});