要判断页面是否加载完成,可以监听 load
事件。
在 window
对象上监听 load
事件是一种常用的方法。它会在页面(包括文档、图片和其他资源)加载完成后触发。
window.addEventListener('load', () => {})
也可以使用 DOMContentLoaded
事件:
document.addEventListener('DOMContentLoaded', () => {})
需要注意:
load
事件触发代表所有资源已经加载完成,可能图片和其他资源会导致页面加载缓慢。DOMContentLoaded
事件触发代表初始的页面结构已经被解析完成并构建,不需要等待页面中的图片和其他资源完成加载。
注意:CSS 加载不会阻塞 DOM 树的解析,但会阻塞 DOM 树的渲染和后面 JS 的执行,JS 会阻塞 DOM 解析。