Overview: When you work with jquery, you'll be sure to use this before:
12345678 |
//document ready
$(document).ready(
function
(){
...code...
})
//document ready 简写
$(
function
(){
...code...
})
|
There are times when you write this:
1234 |
//document load
$(document).load(
function
(){
...code...
})
|
One is the ready one is load, what is the difference between these two? Ready and load who performs first: In the course of an interview, you are often asked a question: Do you want to execute the first one after the load? The answer is ready to execute before load. Steps for DOM document loading: To understand why ready is executed first, the load post-execution process starts by talking about the DOM document loading steps:
123456 |
(1) 解析HTML结构。
(2) 加载外部脚本和样式表文件。
(3) 解析并执行脚本代码。
(4) 构造HTML DOM模型。
//ready
(5) 加载图片等外部文件。
(6) 页面加载完毕。
//load
|
As you can see from the above description, ready is executed after step (4) is complete. However, load will not be executed until step (6) is complete. Ready event: A ready event is painted after the DOM structure has been drawn. This ensures that even if a large number of media files are not loaded, the JS code can be executed as well. Load event: The Load event must wait until all content in the Web page has been loaded before it is executed. If a page has a large number of images, then this happens: The Web document has been rendered, but because the page data is not fully loaded, the Load event can not be triggered immediately. Summary: I believe you have learned the difference between ready and load, in fact, if the page is not a picture of media files such as ready and load is the same, but the page has a file is not the same, so it is recommended that everyone in the work to be used.
What is the difference between the ready and load events of document in the original jquery?