普通

<script src="script.js"></script> 没有 deferasync,浏览器会立即加载并执行指定的脚本,“立即” 指的是在渲染该 script 标签之下的文档元素之前,也就是说不等待后续载入的文档元素,读到就加载并执行。

async

<script async src="script.js"></script>async,加载和渲染后续文档元素的过程将和 script.js 的加载与执行并行进行(异步)。

defer

<script defer src="myscript.js"></script>defer,加载后续文档元素的过程将和 script.js 的加载并行进行(异步),但是 script.js 的执行要在所有元素解析完成之后,DOMContentLoaded 事件触发之前完成。(注意:带有defer属性的脚本执行也不一定按照顺序执行)

参见

javascript - defer 和 async 的区别 - SegmentFault 思否

JS - defer 和 async的更多相关文章

  1. JS—ajax及async和defer的区别

    ###1.ajax  “Asynchronous Javascript And XML”(异步 JavaScript 和 XML) 使用: 如不考虑旧版本浏览器兼容性, // 第一步创建xhr对象 v ...

  2. Js高设笔记1-2章 defer and async

    1,js是由ECMAscript ,dom ,bom组成的专为网页交互而设计的脚本语言.js是脚本语言之一. 2,MIME,是设定某种扩展名的文件用一种应用程序来打开的方式类型,当该扩展名文件被访问的 ...

  3. js中sync、defer、async的区别

    <script src="script.js"></script> 没有 defer 或 async,浏览器会默认为同步sync,会立即加载并执行指定的脚本 ...

  4. javascript的defer和async的区别。

    我们常用的script标签,有两个和性能.js文件下载执行相关的属性:defer和async defer的含义[摘自https://developer.mozilla.org/En/HTML/Elem ...

  5. script标签中defer和async属性的区别

    这篇文章来源于JS高级程序设计第三版中关于script标签的介绍,结合查阅的资料写下的学习笔记. 向html页面中插入javascript代码的主要方法就是通过script标签.其中包括两种形式,第一 ...

  6. defer 和 async 本地对象和宿主对象

    <script async></script> 没有defer和async的情况下是"同步执行"的,浏览器解析到这里的时候,会先加载资源完成后立即执行,并阻 ...

  7. 脚本引用中的defer和async的用法和区别

    之前的博客漫谈前端优化中的引用资源优化曾经提到过脚本引用异步设置defer.async,没有细说,这里展开一下,谈谈它们的作用和区别,先上张图来个针对没用过的小伙伴有个初始印象: 是的,就是在页面脚本 ...

  8. javascript中的defer和async学习+javascript执行顺序

    一.defer和async 我们常用的script标签,有两个和性能.js文件下载执行顺序相关的属性:defer和async defer的含义[摘自https://developer.mozilla. ...

  9. defer和async的区别

    先来试个一句话解释仨,当浏览器碰到 script 脚本的时候: <script src="script.js"></script> 没有 defer 或 a ...

随机推荐

  1. 最大熵与EM算法

    一.熵.联合熵(相当于并集).条件熵.互信息 1.熵是什么? (0)信息量:信息的度量p(xi).信息量和概率成反比,熵是信息量的期望. X是一个随机变量,可能取值有很多个.熵是信息量的期望.熵反应的 ...

  2. android中的rn项目更新gradle及补充二

    修改build.gradle的版本,com.android.tools.build:gradle:2.1.0, 改为更高的,然后更改gradle/wrapper/gradle-wrapper.prop ...

  3. html获取摄像头和相册

    <input type="file" accept="video/*";capture="camcorder"> <inp ...

  4. C# Entity Framework 更新数据的三种方法

    例: 实体类: public class TestDbContext : DbContext { public DbSet<Test> Tests { get; set; } public ...

  5. 使用window10系统搭建完善的Linux开发环境

    https://juejin.im/post/5d22e46ee51d45775746b9b1 导读 在使用window系统开发时由于系统环境和线上环境不一致可能导致各种问题,以及部分扩展库只支持li ...

  6. Zookeeper客户端使用(使用原生zookeeper)

    Zookeeper客户端使用 一.使用原生zookeeper 在pom.xml中加入依赖 <dependency> <groupId>org.apache.zookeeper& ...

  7. C#WinFrom导出Excel

    采用的是以DataGridView的形式导出,使用NPOI.dll 1.由于使用的是DataGridView,所以类需要创建在From的Project下,DLL导入NPOI 2.代码如下 using ...

  8. Charles在windows上抓取本地python的 request请求

    首先打开charles,在Proxy中打开Windows Proxy,这样才能抓取本地请求 python代码中报错Caused by SSLError(SSLError(1, '[SSL: CERTI ...

  9. c# 操作mysql数据库的时候会出现 插入中文汉字变成问号?

    场景: 在mysql ce里面执行时没有问题的. c#操作会出现问号. 原因是:  链接字符串的时候 要设置Charset=utf8; 不然就会按默认的服务器设置编码,通常会出问题. 检查: 1.创建 ...

  10. Comet OJ - Contest #14题解

    Contest14的本质:区间覆盖+Tarjan( A 把距离公式两边平方即可 注意要long long code #include <algorithm> #include <io ...