美文网首页饥人谷技术博客
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