Question

文档说明 async 属性：“设置此布尔属性以指示浏览器应尽可能异步执行脚本。”我认为即使没有这个标签，所有外部脚本都是异步执行的。我错了吗？

如果我已经声明了几个外部脚本，它们会同时下载还是逐个下载？他们将以何种顺序执行？

<script type="text/javascript" src="js/1.js"></script>
<script type="text/javascript" src="js/2.js"></script>
<script type="text/javascript" src="js/3.js"></script>

Answer 1

是。默认情况下，脚本是阻止的。 HTML解析将停止，直到脚本执行完毕（注意脚本进行的某些函数调用可能是异步处理的，并且不会阻止进一步的渲染）。

如果不是这样，那么：

<script src="foo.js"></script>
<p>Hello

和

document.write("foo!");

可能会在foo!之后的某个时间将Hello插入HTML中，因为脚本在执行之前需要一段时间才能下载。

Answer 2

需要立即解决脚本元素。如果它是内联脚本，一切都很好，但如果它是外部资源，则需要先下载。

下载时，它会阻止页面呈现以及可能的其他下载。这就是为什么人们应该在body标签的末尾放置脚本块来阻止尽可能少的其他进程。

3个脚本是并行下载还是依次下载取决于浏览器。现代浏览器同时执行多个http请求，因此具有更好的页面呈现时间。但是，独立于哪个脚本首先完成加载，执行顺序始终是固定的 - 脚本按照它们在html标记中出现的顺序执行（在您的示例中：1.js - ＆gt; 2.js - ＆gt; 3.js）。因此，源代码中最后出现的非常小的.js文件可能是第一个可用的，但是必须等待执行才能下载并执行之前出现的所有其他源文件。

这就是他们引入async的原因 - 它基本上告诉浏览器：“执行的顺序无关紧要，只需下载并在完成下载后执行它，你就有空余时间。”

<script> </script>的“async”属性

2 个答案: