脚本延迟似乎没有按预期工作[重复]答案

【问题标题】：Script defer doesn't seem to work as expected [duplicate]脚本延迟似乎没有按预期工作[重复]
【发布时间】：2018-05-31 21:42:22
【问题描述】：

我有以下测试来查看defer 属性是否延迟脚本块的执行。有2个脚本块。第一个带有defer 属性，第二个没有。如果我理解正确，该属性会在所有 html 解析完成后强制浏览器执行该块（包括另一个 script 块）。

但是看着控制台，我总是先“推迟”。这是为什么？ defer 是否不适用于本地 script 块？

<html>
<body>
   ...

  <script type="text/javascript" defer>
    console.log('from deferred');
  </script>

  <script type="text/javascript">
    console.log('from regular');
  </script>

</body>
</html>

【问题讨论】：

标签： javascript

【解决方案1】：

defer 仅适用于外部脚本：

如果src 属性不存在（即对于内联脚本），则不得使用此属性，在这种情况下它将不起作用。

要为动态插入的脚本实现类似的效果，请改用async=false。具有 defer 属性的脚本将按照它们在文档中出现的顺序执行。

还有，

没有async 或defer 属性的脚本以及内联脚本会在浏览器继续解析页面之前立即获取并执行。

由于本地脚本在页面完成解析之前执行，defer 将不适用。 defer 被应用在解析之后，但在 DomContentLoaded。

【讨论】：