美文网首页饥人谷技术博客
async和defer的具体作用和使用场景。

async和defer的具体作用和使用场景。

作者: 饥人谷_星璇 | 来源:发表于2017-09-07 17:06 被阅读0次
  • async,加载和渲染后续文档元素的过程将和 script.js 的加载与执行并行进行(异步)。

  • defer,加载后续文档元素的过程将和 script.js 的加载并行进行(异步),但 script.js 的执行要在所有元素解析完成之后,DOMContentLoaded 事件触发之前完成。

async和defer都是异步读取,但是他们两个属性还是有不同的地方的,async只适用于外部的脚本文件,并告诉浏览器立即下载文件,但是与defer不同的是,标记为async的脚本并不保证按照指定他们的先后顺序执行。比如:

<script async src="index1.js"></script>
<script async src="index2.js"></script>

以上的代码中,第二个脚本文件可能会在第一个脚本文件之前执行,因此,确保两者之间互不依赖很重要。指定async属性的目的是不让页面去等待两个脚本下载和执行,从而去异步加载其他的内容。

相关文章

网友评论

    本文标题:async和defer的具体作用和使用场景。

    本文链接:https://www.haomeiwen.com/subject/emhijxtx.html