请区分解释 window. onload和 onDocumentReady？

原创于 2024-09-29 15:14:09 发布 · 348 阅读

CC 4.0 BY-SA版权

文章标签：

84 篇文章

订阅专栏

window.onload 和 document.ready 是JavaScript中两种常见的页面加载事件，但它们在何时触发以及如何使用上有所不同。

window.onload： 这是一个事件，它会在整个页面（包括所有依赖资源，如图片，CSS，JavaScript文件等）完全加载后触发。也就是说，window.onload事件是在网页中所有元素完全加载到浏览器后才触发的。因此，如果页面中有一些大的资源文件需要加载，window.onload可能会有一些延迟。
示例：
```
window.onload = function() {
 // Your code here
};
```
document.ready： 这个事件是jQuery库中的一个特性，当DOM（文档对象模型）结构加载完毕后就会触发，不必等待所有的内容（如图片）加载完毕。换句话说，当HTML文档已经完全加载和解析，不需要等待样式表、图像和子框架的完成加载，document.ready就会被触发。

示例
```
$(document).ready(function() {
 // Your code here
});
```
总结一下，window.onload是在整个网页完全加载完成后才触发，包括所有的资源文件；而document.ready则是在DOM结构加载完成后就会触发，不必等待所有的资源文件加载完成。这就是它们的主要区别。