jQuery中ready和load的区别

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/s524061267/article/details/53161295

1. ready方法

           $(document).ready(function(){  
                   ...code...  
           })  
           //document ready 简写  
           $(function(){  
                   ...code...  
           })

2. load方法

           $(window).load(function(){  
                   ...code...  
           })  

• ready和load中ready先执行，load后执行

• DOM文档加载步骤：

1）解析HTML结构；
           2）加载外部脚本和样式文件；
           3）解析并执行脚本代码；
           4）构造HTML DOM模型 ；//ready
           5）加载图片等外部文件；
           6）页面加载完毕。//load
     从以上描述可以看出，ready在第（4）步完成之后就执行，而load在第（6）步完成之后才执行

• ready事件：

       ready事件在DOM结构绘制完成之后就会执行，这样能确保就算有大量的媒体文件没有加载出来，JS代码一样可以执行

• load事件：

       load事件必须等到网页中所有内容全部加载完毕之后才被执行。如果一页网页有大量图片的话，则就出现网页文档已经呈现   出来但网页数据(脚本初始化)还没加载完毕，导致load事件不能够即时被触发.

总结：
ready事件先于load事件被激活，如果网页文档中没有加载外部文件，则它们的响应时间基本上是相同的.