DOMContentLoaded

2025年01月07日

柏拉文

越努力，越幸运

一、认识

---

当初始的 HTML 文档被完全加载和解析完成之后，DOMContentLoaded 事件被触发，而无需等待样式表、图像和子框架的完全加载。

二、语法

---

addEventListener('DOMContentLoaded', (event) => {});

onDOMContentLoaded = (event) => { };

三、对比

---

3.1 window.onload 与 window.DOMContentLoaded

window.onload: 整个页面及所有依赖资源如样式表和图片都已完成加载时，将触发 load 事件

window.DOMContentLoaded: 顾名思义, 只要页面 DOM 加载完成就触发，无需等待依赖资源的加载