[点晴永久免费OA]原生js如何判断页面加载完成？

freeflydom

2024年2月2日 16:12 本文热度 820

要判断页面加载完毕，可以使用原生JavaScript的DOMContentLoaded事件。这个事件会在整个HTML文档被完全加载和解析完成之后触发，而不需要等待样式表、图像和子框架完成加载。

以下是如何使用这个事件的示例：

document.addEventListener('DOMContentLoaded', function() {  
    // 页面加载完毕后执行的代码  
    console.log('页面已加载完毕');  
});

这段代码会在整个页面（包括HTML、CSS和图片）都加载完毕后，在控制台输出“页面已加载完毕”。

需要注意的是，DOMContentLoaded事件与load事件不同。load事件会在所有资源（如图片、脚本文件、CSS文件等）都下载完成之后触发，这通常比DOMContentLoaded事件晚。如果你需要等待所有资源都加载完成，可以使用load事件，如下：

window.addEventListener('load', function() {  
    // 所有资源都加载完毕后执行的代码  
    console.log('所有资源已加载完毕');  
});

以上代码会在所有资源（包括图片、CSS文件、脚本文件等）都加载完毕后，在控制台输出“所有资源已加载完毕”。

该文章在 2024/2/2 16:29:49 编辑过

关键字查询

正在查询...