HTML5 脚本标签，延迟等待任何以前的异步脚本
Posted
技术标签:
【中文标题】HTML5 脚本标签，延迟等待任何以前的异步脚本【英文标题】：HTML5 script tags, does defer wait on any previous async scripts 【发布时间】：2015-04-17 16:47:22 【问题描述】：html5 脚本标签加载指令看起来很酷https://***.com/a/24070373/1070291
是否可以异步加载一堆脚本，但根据异步脚本的完成等待单个脚本执行。
<script src="//some.cdn/jquery.js" async></script>
<script src="//some.cdn/underscore.js" async></script>
<script src="/my-app-which-uses-_-and-jquery.js" defer></script>
我的应用脚本是否保证在我的库之后执行，还是只会与其他延迟脚本一起按顺序执行？
【问题讨论】：
Script Tag - async & defer的可能重复 @AlexanderO'Mara 我认为这是一个不同的问题，链接的更多是关于异步/延迟的一般行为这个问题是关于两者在一起使用时的交互 也许，但它有你的答案。 @AlexanderO'Mara 真的吗？我在里面看不到。 jfriend00 谈论不使用所有异步，但不谈论异步和延迟是否交互 哦，我想我明白了。你在问defer 是否会等待async？
【参考方案1】：
当defer 存在时，它指定脚本在页面完成解析时执行。它不包括 async 脚本。
如果我遇到以下所有脚本都会记录执行日期的情况：
<head>
<link rel="stylesheet" href="style.css">
<script src="script.js" async></script>
<script src="script2.js" async></script>
<script src="script3.js" defer></script>
</head>
<body>
<script>
console.log("Body script executed at : " + new Date());
</script>
</body>
我可能有这个输出：
Body script executed at : Tue Feb 17 2015 00:05:08 GMT-0300
script2.js:2 Script 2 executed at :Tue Feb 17 2015 00:05:08 GMT-0300
script.js:2 Script 1 executed at:Tue Feb 17 2015 00:05:08 GMT-0300
script3.js:2 Script 3 executed at :Tue Feb 17 2015 00:05:08 GMT-0300
script3.js (defer) 将等待“<body>”，但不会等待 script1.js (async)、script2.js(async)。
这是PLUNKER
【讨论】：
我认为 'script3.js (defer) 将等待 script1.js (async)、script2.js(async) 和 '' 才能被执行。不正确，当我尝试您的示例时，我在另外 2 个中间发生了 3 个 defer 将等待 ，而不是异步脚本。我会更新我的答案 答案似乎是否定的，真的有点可惜。 看起来这是一个好主意，只将没有人依赖它执行的脚本标记为异步。以上是关于HTML5 脚本标签，延迟等待任何以前的异步脚本的主要内容，如果未能解决你的问题，请参考以下文章