async脚本下载完立即执行、无序且不保证DOM就绪；defer脚本在HTML解析完成后再按书写顺序执行、有序且DOM已就绪；两者均不阻塞HTML解析，适用场景取决于脚本是否依赖DOM或其它脚本。
当页面中引入多个外部 JavaScript 脚本时，async 和 defer 会显著影响脚本的下载与执行时机，进而改变代码实际运行顺序。它们都不阻塞 HTML 解析（即不会像默认 script 那样“暂停渲染”），但关键区别在于：async 是“下载完就立刻执行”，而 defer 是“等整个 HTML 解析完、DOM 构建完成后再按书写顺序执行”。
async：无序、独立、尽早执行
带有 async 的脚本会异步下载，下载完成后**立即执行**，不保证执行顺序，也不等待 DOM 就绪或其它脚本。
- 多个 async 脚本之间**无执行先后保障**——谁先下载完谁先执行，哪怕后写的 script 标签先加载完，也会先执行
- 它不关心 DOM 是否解析完毕，执行时 DOM 可能还不完整（比如
document.getElementById可能返回 null） - 适合相互无关、无需操作 DOM 或依赖其它脚本的场景，例如埋点统计、广告 SDK
defer：有序、延迟、DOM 就绪后执行
带有 defer 的脚本也是异步下载，但会**等到整个 HTML 文档解析完成（DOMContentLoaded 触发前）再按 script 标签出现的顺序依次执行**。
- 多个 defer 脚本严格遵循 HTML 中的书写顺序执行，即使后一个脚本下载更快，也必须等前一个执行完
- 执行时 DOM 已构建完毕，可安全操作元素（如查询、绑定事件）
- 适合有依赖关系、需操作 DOM 的模块化脚本，例如初始化组件、表单校验逻辑
与普通 script（无属性）的对比
默认 script 会同步下载并立即执行，阻塞 HTML 解析，因此 DOM 构建会中断；而 async/defer 都避免了这种阻塞，是现代页面优化的常用手段。
立即学习“Java免费学习笔记（深入）”；
- 无属性 script：下载 + 执行 → 暂停解析 → 继续
- async：下载（不阻塞）→ 下载完立即执行（可能打断解析）→ 不保证顺序
- defer：下载（不阻塞）→ 解析完 HTML → 按序执行（不打断解析）
实际使用建议
选哪个取决于脚本用途和依赖关系：
- 只做数据上报、第三方分析，且彼此无调用关系 → 用 async
- 需要操作 DOM，或多个脚本存在执行依赖（如 A 初始化工具函数，B 使用该函数）→ 用 defer
- 内联脚本（
<script>...</script>）不支持 async/defer，若需延迟执行，应包裹在DOMContentLoaded或load事件中 - 同一个 script 标签上同时写 async 和 defer，浏览器会优先采用 async（defer 被忽略）
