Javascript 加载多个js文件时，“延迟”属性应该如何工作？

我举了以下例子：

<script >
    console.log('first');
</script>
<script defer>
    console.log('last');
</script>
<script>
    console.log('second');
</script>

console.log（'first'）；
console.log（'last'）；
console.log（'second'）；

就在我的html头部，我希望控制台以asc顺序（第一秒-第三秒）打印它们，但是，我实际看到的是按照这些脚本的放置顺序（第一-最后一秒）进行的

我认为'defer'属性将加载脚本，但将在DOM完全加载之前执行。不知道为什么这不会发生

---

关于，

您可能需要使用不同的解决方案

由于此功能尚未在所有其他主流浏览器中实现，因此作者不应假定脚本的执行实际上会延迟。对于没有src属性的脚本，不应使用defer属性。自Gecko 1.9.2以来，对于没有src属性的脚本，会忽略defer属性。但是，在Gecko 1.9.1中，如果设置了defer属性，则即使内联脚本也会延迟

我建议使用像SystemJS这样的模块加载器来确保同步加载模块。

---

defer

属性适用于通过带有URL的

src

属性加载的脚本，而不适用于内联脚本

您可以在这里看到延迟和异步属性的整个HTML5规范逻辑：

如果你仔细阅读上面那篇文章中的所有HTML5规则，你会发现它们都不符合你的情况，因为

标签上没有

src

属性。因此，它涉及到最后一种情况：

否则，用户代理必须立即执行脚本块， 即使其他脚本已经在执行

最终结果是，

defer

属性对内联且没有

src

属性的脚本标记没有影响

---

---

如果要在另外两个之后执行中间的

，则需要更改其顺序，在适当的时间动态插入，或者将代码放入单独的脚本文件中，以便可以在

标记上使用

src

属性。

延迟

仅用于外部脚本，而不是内联代码，这不需要加载…“延迟”属性，目前似乎只有一些浏览器支持。我不建议使用它。一些浏览器？说是关于他们所有人…同意，那一段的第一行可以省略。

System.import('./script1.js').then(function(m) {
    System.import('./script2.js').then(function(n) {
        console.log(m, n);
    });
});