网上说法很多，很少一句话能总结清楚的，终于找到两句一针见血的描述，很到位：

相同点：都不阻塞DOM解析

defer  ：顺序：保证先后顺序。解析：HTML 解析器遇到它们时，不阻塞（脚本将被异步下载），待文档解析完成之后，执行脚本。

async  ：顺序：不保证先后顺序。解析：HTML 解析器遇到它们时，不阻塞（脚本将被异步下载，一旦下载完成，立即执行它），并继续解析之后的文档。

总结一下：defer 效果是 ：js异步下载完毕后且DOM解析完成后且DOMContentLoaded 事件触发之前按照按页面脚本出现次序顺序从上至下依次执行！

async 效果是：哪个js先下载就先执行，不按页面脚本出现次序顺序，js的执行一定是在 window的load事件触发之前

顺便一提：window的load事件会在页面中的一切都加载完毕时触发，但这个过程可能会因为要加载外部资源过多而颇费周折。

而DOMContentLoaded事件则在形成完成的DOM树之后就会触发，不理会图像、JavaScript文件、CSS文件或其他资源是否已经下载完毕。

个人建议：如果加载的JS存在依赖关系，建议使用defer来保证安全，否则使用async即可

已获得广泛浏览器支持，但使用时需要查询兼容性！

js异步加载 defer和async 比较的更多相关文章

  1. 点评js异步加载的4种方式

    主要介绍了点评js异步加载的4种方式,帮助大家更全面的了解js异步加载方式,感兴趣的小伙伴们可以参考一下 js异步加载的4种方式,点评开始. <!DOCTYPE html> <htm ...

  2. JS异步加载的三种方式

    js加载的缺点:加载工具方法没必要阻塞文档,过得js加载会影响页面效率,一旦网速不好,那么整个网站将等待js加载而不进行后续渲染等工作. 有些工具方法需要按需加载,用到再加载,不用不加载,. 默认正常 ...

  3. 关于JS异步加载方案

    javascript延迟加载的解决方案: 1.使用defer标签 <span style="font-size: small;"><script type=&qu ...

  4. 转:web前端面试题合集 (Javascript相关)（js异步加载详解）

    1. HTTP协议的状态消息都有哪些? 1**:请求收到,继续处理2**:操作成功收到,分析.接受3**:完成此请求必须进一步处理4**:请求包含一个错误语法或不能完成5**:服务器执行一个完全有效请 ...

  5. JS异步加载的三种方案

    js加载的缺点:加载工具方法没必要阻塞文档,个别js加载会影响页面效率,一旦网速不好,那么整个网站将等待js加载而不进行后续渲染等工作. 有些工具方法需要按需加载,用到再加载,不用不加载. 一.def ...

  6. js 异步加载的方式

    js 异步加载的方式 渲染引擎遇到 script 标签会停下来,等到执行完脚本,继续向下渲染 defer 是“渲染完再执行”,async 是“下载完就执行”,defer 如果有多个脚本,会按照在页面中 ...

  7. 关于使用Iscroll.js异步加载数据后不能滑动到最底端的问题解决方案

    关于使用Iscroll.js异步加载数据后不能滑动到最底端,拉到最下边又弹回去的问题困扰了我老半天,相信很多朋友都遇到了.我刚好不小心解决了,和大家分享一下.由于各种忙,下边就直接上代码吧. (前提是 ...

  8. js异步加载的5种方式

    方案1:$(document).ready 点评: 1.需要引用jquery 2.兼容所有浏览器. 方案2:<script>标签的async="async"属性 asy ...

  9. js异步加载的解决方案

    默认情况javascript是同步加载的,javascript的加载时阻塞的,后面的元素要等待javascript加载完毕后才能进行再加载,如何解决这个问题呢,接下来将为你详细介绍下异步加载js三种实 ...

随机推荐

  1. ueditor 单独图片上传 转载

    <body> <script type="text/javascript"> //这个是图片上传的,网上还有附件上传的 (function($) { var ...

  2. Cocos2d-JS键盘事件

    Cocos2d-JS中的键盘事件与触摸事件不同,它没有空间方面信息.键盘事件不仅可以响应键盘,还可以响应设备的菜单.键盘事件是EventKeyboard,对应的键盘事件监听器(cc.EventList ...

  3. Cocos2d-JS动画

    与动作密不可分的还有动画,动画又可以分为场景过渡动画和帧动画.场景过渡动画我们在以往介绍过,这一个我们只介绍帧动画.帧动画帧动画就是按一定时间间隔.一定的顺序.一帧一帧地显示帧图片.我们的美工要为精灵 ...

  4. 深刻理解C#中资源释放

    今天我的一个朋友看到我写的那篇<C#中用AJAX验证用户登录>时,给我指出了点小毛病.就是在用户登录时,如果用户登录失败,在下面这段代码中,都会new出来一个User对象,如果连续登录失败 ...

  5. asp.net 客户邮件群发功能 SendMail 发送静态化html

    背景:现在几乎每个企业都要用到邮箱,而在大客户量情况下,为我们的不同等级的客户送上节日关怀,以及把我们的喜讯.新品通知到他们是我们急需解决的问题.效果如图 思路: 1.静态化网页模版,首先考虑需要发送 ...

  6. 标识域 Identify Field

    在对象中保存DB的ID字段,以维持内存对象和DB数据Row之间的identify. 关系DB使用key来区分数据行. 而内存对象不需要这样的键.因为对象系统能够保证身份确认. 读取时没有问题,但是为了 ...

  7. 数列平方根的和 java

    题目描述: 数列的定义如下:数列的第一项为n,以后各项为前一项的平方根,求数列的前m项的和. 输入 输入数据有多组,每组占一行,由两个整数n(n<10000)和m(m<1000)组成,n和 ...

  8. 合并大量txt文件的内容

    首先熟悉一个dos命令 显示文件内容命令——type命令 1.格式:type [盘符:] [路径] 文件名 2.类型:内部命令 3.功能:把指定的文件内容在屏幕上显示或打印机输出,它常用作查阅和显示文 ...

  9. 2013-07-23 IT 要闻速记快想

    ### ========================= ###苹果的新动向今天华尔街日报称,苹果正在测试13英寸的大号iPad,以及更大屏幕的iPhone.而早在五月份,韩国资讯网站 ET New ...

  10. vmware虚拟机上网：host-only

    host-only配置 首先主机:vmware1要能共享本地连接这个网络,共享后vmware的ip会自动设置为如图 其次,vmware网络设置如图 最后,虚拟机设置如图 这样,主机与虚拟机之间就能pi ...