js 页面加载

作者：潇洒一醉发布日期:2025-08-24 浏览:89

// 当页面加载完成时执行的代码
window.onload = function() {
    // 这里的代码会在页面所有内容（包括图片、样式等）都加载完成后执行
    console.log("页面已经完全加载");
};

// 或者使用更现代的 DOMContentLoaded 事件，它会在 DOM 解析完成后立即触发，而不需要等待所有资源（如图片）加载完毕
document.addEventListener('DOMContentLoaded', function() {
    // 这里的代码会在 DOM 加载完成后立即执行，但图片等资源可能还未加载完成
    console.log("DOM 已经加载并解析完成");
});

解释说明：

window.onload:
- 当页面的所有内容（包括图片、样式表等）都加载完成后，才会触发 window.onload 事件。
- 如果你的代码依赖于所有的资源都加载完毕（例如图片的高度和宽度），你应该将代码放在 window.onload 中。
DOMContentLoaded:
- 这个事件在 DOM 完全加载并解析完成后触发，但此时图片、样式表等外部资源可能还没有加载完成。
- 如果你只需要确保 HTML 结构已经准备好，可以使用 DOMContentLoaded，这样可以更快地执行代码。

上一篇：js 修改class

下一篇：js 加载图片