jQuery 的 ready() 方法的快捷方式
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/3907527/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Shortcuts for jQuery's ready() method
提问by Wilkins
I have seen some shortcuts for the ready() method and would like to know which actually happens first, because my test results confuse me..
我已经看到了 ready() 方法的一些快捷方式,想知道哪个先发生,因为我的测试结果让我感到困惑..
$(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 invoketechnique considered a ready()method?
这里首先发生自调用,然后是文档,然后是窗口。是自调用技术被认为是准备()方法?
回答by Nick Craver
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), thisis probably the shortcut you're thinking of though:
第三个选项不是.ready()
(或真正与 jQuery 相关的)的快捷方式,自调用会立即运行(只要它出现在代码中),这可能是您正在考虑的快捷方式:
$(function(){
alert("I'm a ready shortcut");
});
Passing a function into $(func)
is a shortcut for $(document).ready(func);
. The no-conflictversion would look like this:
将函数传入$(func)
是$(document).ready(func);
. 在没有冲突的版本是这样的:
jQuery(function($) {
//$ is jQuery
});
回答by Chris
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.
Nick Craver 的说法是对的,但我认为值得注意的是,在最后一个例子中,它实际上根本没有对 jquery 做任何事情。jQuery 被作为参数传递给匿名函数,但该函数没有对它做任何事情。
The last example is equivalent to an Immediately-Invoked Function Expression (IIFE):
最后一个示例等效于立即调用函数表达式 (IIFE):
(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.
很明显,这只是在该行代码被命中时立即调用匿名函数,从而发出警报。它根本没有调用 jQuery,这就是为什么当 Nick 说它绝对不是一个 ready() 方法时是对的。
回答by Hector Correa
This articlehas 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"); });
$(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"); });