script标签中defer和async有什么不同?

简介: script标签中defer和async有什么不同?

对比

我们可以在网址中经常看到script标签出现async以及defer的属性

e4098678461a494690c7ebd642cf2f93.png


   defer:script被异步加载后并不会⽴刻执⾏,而是要等到整个页面在内存中正常渲染结束后,才会执行。多 个 defer 脚本会按照它们在页面出现的顺序加载。


   async:同样是异步加载脚本,区别是脚本加载完毕后⽴即执⾏,这导致async属性下的脚本是乱序的,对于script有先后依赖关系的情况,并不适⽤。


我们可以参考MDN上关于 HTMLScriptElement 的描述:https://developer.mozilla.org/zh-CN/docs/Web/API/HTMLScriptElement


053840da702145f6806a3aa2eac726bd.png




目录
打赏
0
0
0
0
21
分享
相关文章
一个js里可以有多少个async function,如何用最少的async function实现多个异步操作
在 JavaScript 中,可以通过多种方法实现多个异步操作并减少 `async` 函数的数量。
js【详解】async await
js【详解】async await
51 0
理解 <script> 标签的 defer 和 async 属性
理解 <script> 标签的 defer 和 async 属性
199 3
js - ASYNC/AWAIT
`async/await` 是一个 es7 的语法
<script> 标签上的 defer 和 async 属性是什么?
它会执行以下步骤 1.暂停 HTML 文档解析器 2.创建新请求以下载脚本 3.在脚本完全下载后立即执行脚本 4.执行结束后,继续解析 HTML 文档
了解js中async-await
了解async异步函数如何使用并且使用中的注意点
203 0
了解js中async-await
目录
目录