Shortcuts for jQuery's ready() method

99封情书 提交于 2019-12-17 21:50:01

问题


I have seen some shortcuts for the ready() method and would like to know which actually happens first, because my test results confuse me..

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

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

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

Here self invoke happens first, then document, then window. Is the self invoke technique considered a ready() method?


回答1:


The third option is not a shortcut for .ready() (or jQuery related really), the self invoke runs immediately (as soon as it appears in the code), this is probably the shortcut you're thinking of though:

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

Passing a function into $(func) is a shortcut for $(document).ready(func);. The no-conflict version would look like this:

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



回答2:


Nick Craver is right in what he says but I think it is worth noting that in that last example that it isn't actually doing anything with jquery at all. jQuery is being passed as a parameter to the anonymous function but the function isn't doing anything with it.

The last example is equivalent to:

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

And clearly this is just immediately calling the anonymous function as soon as that line of code is being hit and thus doing the alert. It isn't invoking jQuery at all which is why Nick is right when he says it is defintiely not a ready() method.




回答3:


This article has a good explanation on how the first two are different:

$(document).ready vs. $(window).load

jQuery offers two powerful methods to execute code and attach event handlers: $(document).ready and $(window).load. The document ready event executes already when the HTML-Document is loaded and the DOM is ready, even if all the graphics haven't loaded yet. If you want to hook up your events for certain elements before the window loads, then $(document).ready is the right place.

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

The window load event executes a bit later when the complete page is fully loaded, including all frames, objects and images. Therefore functions which concern images or other page contents should be placed in the load event for the window or the content tag itself.

$(window).load(function() {
  // executes when complete page is fully loaded, 
  // including all frames, objects and images
  alert("window is loaded");
});


来源:https://stackoverflow.com/questions/3907527/shortcuts-for-jquerys-ready-method

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!