文档加载的两种方式 window.onload 和ready

最新推荐文章于 2024-08-15 11:39:27 发布

wangbinXMU

最新推荐文章于 2024-08-15 11:39:27 发布

阅读量558

点赞数

分类专栏：前端 DOM jQuery

本文链接：https://blog.csdn.net/wangbinXMU/article/details/78940267

版权

前端 DOM jQuery 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

  我们在jQ或JS中的代码一直在使用$(function () { });这段代码进行首尾包裹，原因是我们jQuery库文件是在body元素之前加载的，我们必须等待所有的DOM元素加载后，延迟支持DOM操作，否则就无法执行我们想要执行的DOM操作。 

  在延迟等待加载，JavaScript提供了一个事件为load，jQ提供了ready()方法，如下： 

 
 window.onload = function () {}; //JavaScript等待加载 

 
 $(document).ready(function () {}); //jQuery等待加载 

  虽然这两种方式都保证了HTML文档中的所有元素加载完毕后再执行DOM操作，但是有一定的区别如下： 

  在实际应用中，我们都很少直接去使用window.onload，因为他需要等待图片之类的大 
 型元素加载完毕后才能执行JS代码。故再网速较慢的情况下，页面已经全面展开，图片还在缓慢加载，这时页面上任何的JS交互功能全部处在假死状态, 在js文件中，ready方法的简写形式更：$(function(){ })更简便。 