JS脚本defer的作用示例介绍

在HTML文档中，`

在这个例子中，`script.js` 文件通过 `` 被包含进来，并指定了 `defer` 属性。这意味着浏览器会在解析完整个HTML文档后，再执行 `script.js` 中的JavaScript代码。

`script.js` 文件的内容可以是这样的：

document.addEventListener('DOMContentLoaded', function() {
    console.log('文档已完全加载和解析完成，现在执行脚本。');
    // 这里可以添加更多的初始化代码
});

虽然在这个特定的例子中，我们使用了 `DOMContentLoaded` 事件来确保DOM完全加载后再执行代码，但 `defer` 属性本身已经保证了脚本会在文档加载完成后执行，这使得在脚本中直接使用DOM元素成为可能，而无需显式监听 `DOMContentLoaded` 事件（除非你有其他需要在DOM加载完成后立即执行的代码）。

注意，如果一个 `