前端笔试小结之$(document).ready() vs window.onload()

最新推荐文章于 2025-09-12 14:39:04 发布

weixin_34362991

最新推荐文章于 2025-09-12 14:39:04 发布

阅读量68

点赞数

CC 4.0 BY-SA版权

文章标签：前端 ViewUI

原文链接：https://segmentfault.com/a/1190000004976402

本文详细解释了$(document).ready()与window.onload()的使用场景与区别，包括它们在DOM树构建好后执行与页面所有元素加载完成后执行的特点，以及如何正确使用它们来优化网页加载体验。

之前项目中总是使用$(document).ready()，由于在$(document).ready()方法内注册的事件，只要DOM就绪就会被执行，因此可能此时元素的关联文件未下载完，则设置的属性可能无效。
结果笔试那天自己还记反写错了。还是因为自己没有理解。

$(document).ready()是在DOM树构建好后就执行，
window.onload()则是等待页面所有元素都加载完成后才执行。
$(document).ready()可以有多个，每次调用$(document).ready()方法都会在现有的行为上追加新的行为，这些行为函数会根据注册的顺序依次执行，
window.onload()只能执行一个，后面的函数会覆盖前面的函数。
$(document).ready(function(){})通常可以简写为$(function(){})，
$(window).load(function(){})等价于window.onload()