js 实现 defer
在 JavaScript 中，defer 是一种脚本加载属性，用于延迟脚本的执行，直到 HTML 文档解析完成。以下是几种实现类似 defer 功能的方法：
使用 defer 属性
在 HTML 中直接为 <script> 标签添加 defer 属性，这是最直接的方式：
<script src="script.js" defer></script>defer 确保脚本在文档解析完成后按顺序执行，但不会阻塞 DOM 构建。
动态加载脚本
通过 JavaScript 动态创建 <script> 标签并设置 defer 属性：
const script = document.createElement('script');
script.src = 'script.js';
script.defer = true;
document.head.appendChild(script);这种方式适用于需要动态加载脚本的场景。
监听 DOMContentLoaded 事件
通过监听 DOMContentLoaded 事件延迟脚本执行，模拟 defer 行为：
document.addEventListener('DOMContentLoaded', () => {
// 在这里执行需要延迟的代码
console.log('DOM 解析完成，脚本现在执行');
});这种方法适用于内联脚本或需要更灵活控制的场景。
使用 async 与 Promise
结合 async 和 Promise 实现类似 defer 的效果：
async function loadDeferredScript() {
await new Promise(resolve => {
window.addEventListener('load', resolve);
});
// 延迟执行的代码
console.log('页面加载完成，脚本执行');
}
loadDeferredScript();这种方法适用于需要等待所有资源（包括图片等）加载完成的场景。
模块化加载（ES Modules）
使用 ES Modules 的 type="module" 特性，默认具有 defer 行为：
<script type="module" src="module.js"></script>模块脚本默认延迟执行，且支持更现代的模块化语法。
