jQuery document.ready vs自调用匿名函数
[英]jQuery document.ready vs self calling anonymous function
问题描述
What is the difference between these two. 
这两者有什么区别。
$(document).ready(function(){ ... });(function(){ ... })();
Are these both functions called at the same time? 这两个函数同时被调用吗？ I know, document.ready will be triggered when the entire HTML page is rendered by the browser but what about 2nd function (self calling anonymous function). 我知道，当浏览器呈现整个HTML页面时会触发document.ready，但第二个函数（自调用匿名函数）会怎样。 Does it wait for browser to complete rendering the page or it is called whenever it is encountered? 是否等待浏览器完成呈现页面，或者只要遇到它就会调用它？
5 个解决方案
解决方案1
110 2010-07-15 20:06:49
$(document).ready(function(){ ... });or short$(function(){...});或短 $(function(){...});This Function is called when the
DOM is readywhich means, you can start to query elements for instance.当DOM is ready时调用此函数，这意味着您可以开始查询元素。.ready()will use different ways on different browsers to make sure that the DOM really IS ready..ready()将在不同的浏览器上使用不同的方式来确保DOM真的准备就绪。(function(){ ... })();That is nothing else than a function that invokes itself as soon as possible when the browser is interpreting your
ecma-/javascript.这只不过是一个在浏览器解释你的ecma-/javascript时尽快调用自身的函数。 Therefor, its very unlikely that you can successfully act onDOM elementshere.因此，你不太可能在这里成功地对DOM elements采取行动。
解决方案2
46 2010-07-15 20:05:55
(function(){...})(); will be executed as soon as it is encountered in the Javascript. 将在Javascript中遇到它后立即执行。
$(document).ready() will be executed once the document is loaded. 加载文档后，将执行$(document).ready() 。 $(function(){...}); is a shortcut for $(document).ready() and does the exact same thing. 是$(document).ready()的快捷方式，并完全相同。
解决方案3
25 2010-07-15 20:08:31
$(document).ready(function() { ... });simply binds that function to thereadyevent of the document, so, as you said, when the document loads, the event triggers.简单地将该函数绑定到文档的ready事件，因此，正如您所说，当文档加载时，事件会触发。(function($) { ... })(jQuery);is actually a construct of Javascript, and all that piece of code does is pass thejQueryobject intofunction($)as a parameter and runs the function, so inside that function,$always refers to thejQueryobject.实际上是Javascript的一个构造，所有这段代码都是将jQuery对象作为参数传递给function($)并运行函数，因此在该函数中，$always总是引用jQuery对象。 This can help resolve namespacing conflicts, etc.这有助于解决命名空间冲突等问题。
So #1 is executed when the document is loaded, while #2 is run immediately, with the jQuery object named $ as shorthand. 因此，＃1在文档加载时执行，而＃2立即运行， jQuery对象名为$ as shorthand。
解决方案4
24 2015-09-17 01:52:10
The following code will be executed when the DOM (Document object model) is ready for JavaScript code to execute. 当DOM（Document对象模型）准备好执行JavaScript代码时，将执行以下代码。
$(document).ready(function(){
// Write code here
});
The short hand for the above code is: 以上代码的简写是：
$(function(){
// write code here
});
The code shown below is a self-invoking anonymous JavaScript function, and will be executed as soon as browser interprets it: 下面显示的代码是一个自我调用的匿名JavaScript函数，一旦浏览器解释它就会执行：
(function(){
//write code here
})(); // It is the parenthesis here that call the function.
The jQuery self-invoking function shown below, passes the global jQuery object as an argument to function($) . 下面显示的jQuery自调用函数将全局jQuery对象作为参数传递给function($) 。 This enables $ to be used locally within the self-invoking function without needing to traverse the global scope for a definition. 这使得$可以在自调用函数中本地使用，而无需遍历定义的全局范围。 jQuery is not the only library that makes use of $ , so this reduces potential naming conflicts. jQuery不是唯一使用$库，因此这可以减少潜在的命名冲突。
(function($){
//some code
})(jQuery);
解决方案5
16 2010-07-15 20:02:58
document.ready run after DOM is "constructed". 在DOM“构建”之后运行document.ready。 Self-invoking functions runs instantly - if inserted into <head> , before DOM is constructed. 自我调用函数立即运行 - 如果在构造DOM之前插入<head> 。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.