DOM 加载事件 - JavaScript

在 JavaScript 中，DOM 加载事件用于在 HTML 文档中的 DOM 元素完全加载和解析后执行特定的代码。DOM 加载事件对于在页面加载完成后执行 JavaScript 动作非常有用。

常见的 DOM 加载事件有两种：

1. DOMContentLoaded 事件：当初始的 HTML 文档被完全加载和解析时触发。
2. load 事件：当整个页面（包括图片、样式表、脚本等）被完全加载时触发。

可以使用 JavaScript 来监听这两种事件并执行相应的操作。以下是一个示例：

// 使用 DOMContentLoaded 事件
document.addEventListener('DOMContentLoaded', function() {
  // 在 DOM 加载完成后执行的代码
  console.log('DOM 加载完成');
});

// 使用 load 事件
window.addEventListener('load', function() {
  // 在页面完全加载后执行的代码
  console.log('页面加载完成');
});

以上代码片段展示了如何使用 addEventListener 函数来监听 DOMContentLoaded 和 load 事件，并在事件发生时执行相应的代码。

注意，DOMContentLoaded 事件会在整个页面的 DOM 加载完成后立即触发，这意味着它会比 load 事件更早执行。而 load 事件会等到页面上的所有资源（如图片、样式表、脚本等）都加载完成后才触发。

在实际开发中，可以使用这两种事件来执行一些初始化操作，或者处理需要在页面完全加载后才能执行的代码。

请确保在使用这些 DOM 加载事件时，相关的 JavaScript 代码放在 <script> 标签内，且放在 HTML 文档中的合适位置。

以上就是关于 DOM 加载事件的介绍，希望对你有所帮助！