document.onload
和 document.ready
这两个事件在 JavaScript 中常被用于确定页面何时准备好运行脚本,但它们的触发时间并不相同:
document.onload
:这是一个浏览器事件,它会在整个页面完全加载后触发,包括所有的图片、CSS、脚本文件、iframe等。因此,如果一个网页包含了大量的内容(例如大图片或视频),document.onload
事件可能需要较长时间才能触发。window.onload = function() { // 页面所有内容(包括图片、CSS、脚本文件等)都已完全加载 console.log("Page fully loaded"); };
document.ready
:这是 jQuery 库中的一个事件,它会在 DOM 完全加载和解析后就触发,无需等待样式表、图像和子框架的完成加载。这意味着,当我们可以开始操作 DOM 时,document.ready
就会触发,这通常比document.onload
更早。$(document).ready(function() { // DOM 已完全加载和解析,无需等待其他内容 console.log("DOM ready"); });
所以,如果你的 JavaScript 代码需要操作 DOM 元素,但并不需要等待所有的图片、CSS 和其他资源完全加载,那么使用
document.ready
通常是更好的选择。