jQuery-$（document）.ready和$（window）.load有什么区别？

技术2025-01-16 13

本文翻译自：jQuery - What are differences between $(document).ready and $(window).load?

What are differences between 之间有什么区别

$(document).ready(function(){ //my code here });

and 和

$(window).load(function(){ //my code here });

And I want to make sure that: 我想确保：

$(document).ready(function(){ })

and 和

$(function(){ });

and 和

jQuery(document).ready(function(){ });

are the same. 是相同的。

Can you tell me what differences and similarities between them? 你能告诉我它们之间有什么异同吗？

#1楼

参考：https://stackoom.com/question/ZEHv/jQuery-document-ready和-window-load有什么区别

#2楼

This three function are the same. 这三个功能是相同的。

$(document).ready(function(){ })

and 和

$(function(){ });

and 和

jQuery(document).ready(function(){ });

here $ is used for define jQuery like $ = jQuery . 这里$用于定义jQuery例如$ = jQuery 。

Now difference is that 现在的区别是

$(document).ready is jQuery event that is fired when DOM is loaded, so it's fired when the document structure is ready. $(document).ready是jQuery事件，它在加载DOM时触发，因此在文档结构就绪时触发。

$(window).load event is fired after whole content is loaded like page contain images,css etc. 加载整个内容（例如页面包含图像，css等$(window).load后，将触发$(window).load事件。

#3楼

在仅将html页面加载到浏览器并执行功能的情况下，总是执行ready事件。但是，在将所有页面内容都加载到该页面的浏览器时，将执行load事件。 ..当我们在jquery脚本中使用noconflict（）方法时，我们可以使用$或jQuery ...

#4楼

The Difference between $(document).ready() and $(window).load() functions is that the code included inside $(window).load() will run once the entire page(images, iframes, stylesheets,etc) are loaded whereas the document ready event fires before all images,iframes etc. are loaded, but after the whole DOM itself is ready. $(document).ready()和$(window).load()函数之间的区别在于，包含在$(window).load()中的代码将在整个页面（图像，iframe，样式表等）运行一次加载，而文档就绪事件在所有图像，iframe等加载之前触发，但在整个DOM本身就绪之后触发。

$(document).ready(function(){ })

and 和

$(function(){ });

and 和

jQuery(document).ready(function(){ });

There are not difference between the above 3 codes. 以上三个代码之间没有区别。

They are equivalent,but you may face conflict if any other JavaScript Frameworks uses the same dollar symbol $ as a shortcut name. 它们是等效的，但是如果任何其他JavaScript框架使用相同的美元符号$作为快捷方式名称，则可能会遇到冲突。

jQuery.noConflict(); jQuery.ready(function($){ //Code using $ as alias to jQuery });

#5楼

$(document).ready(function(e) { // executes when HTML-Document is loaded and DOM is ready console.log("page is loading now"); }); $(document).load(function(e) { //when html page complete loaded console.log("completely loaded"); });

#6楼

$(window).load is an event that fires when the DOM and all the content (everything) on the page is fully loaded like CSS, images and frames. $（window）.load是一个事件，当DOM和页面上的所有内容（所有内容）（如CSS，图像和框架）完全加载时将触发此事件。 One best example is if we want to get the actual image size or to get the details of anything we use it. 最好的例子是我们要获取实际的图像尺寸或获取我们使用它的任何细节。

$(document).ready() indicates that code in it need to be executed once the DOM got loaded and ready to be manipulated by script. $（document）.ready（）表示，一旦DOM被加载并准备好被脚本处理，就需要执行其中的代码。 It won't wait for the images to load for executing the jQuery script. 它不会等待图像加载以执行jQuery脚本。

$(window).load fired after the $(document).ready(). $（window）.load在$（document）.ready（）之后触发。

$(document).ready(function(){ }) //and $(function(){ }); //and jQuery(document).ready(function(){ });

Above 3 are same, $ is the alias name of jQuery, you may face conflict if any other JavaScript Frameworks uses the same dollar symbol $. 上面的3相同，$是jQuery的别名，如果其他JavaScript框架使用相同的美元符号$，则可能会遇到冲突。 If u face conflict jQuery team provide a solution no-conflict read more. 如果您遇到冲突，jQuery团队会提供无冲突的解决方案，以了解更多信息。

$(window).load was deprecated in 1.8, and removed in jquery 3.0 $（window）.load在1.8中已弃用，并在jquery 3.0中删除

Processed: 0.008, SQL: 9