defer

  • HTML4.01定义的
  • 只适用于外部脚本（IE4~7会支持内嵌脚本的defer属性）
  • 告诉浏览器立即下载，延迟执行，脚本会延迟到整个页面全部解析完毕之后才运行
  • HTML5规范要求脚本按照他们出现的先后顺序执行，第一个延迟脚本先于第二个延迟脚本执行，这两个脚本会先于DOMContentLoaded事件执行，而在现实浏览器中，延迟脚本不一定会按照顺序执行，也不一定在DOMContentLoaded事件触发前执行，因此最好只包含一个延迟脚本。

async

  • HTML5定义的
  • 只适用于外部脚本
  • 与defer不同的是，标记为async的脚本不保证按照指定他们的先手顺序执行，因此确保多个脚本之间互不依赖非常重要，指定async属性的目的是不让页面等待两个脚本下载和执行，从而异步加载页面其他内容。为此，建议脚本不要在加载期间修改DOM。
  • 指定了async属性的脚本一定会在页面的load事件前执行，但可能会在DOMContentLoaded事件触发之前或之后执行

defer 与 async的更多相关文章

  1. javascript的defer和async的区别。

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

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

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

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

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

  4. JavaScript 的 defer 与 async

    当解析器遇到 script 标签时,文档的解析将停止,并立即下载并执行脚本,脚本执行完毕后将继续解析文档.但是我们可以将脚本标记为 defer,这样就不会停止文档解析,等到文档解析完成才执行脚本,也可 ...

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

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

  6. JavaScript标记上的defer与async的作用与区别

    当浏览器遇到 script 标签时,文档的解析将停止,并立即下载并执行脚本,脚本执行完毕后将继续解析文档.但是我们可以将脚本标记为 defer,这样就不会停止文档解析,等到文档解析完成才执行脚本,也可 ...

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

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

  8. defer和async的区别

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

  9. script的defer和async

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

  10. javascript延迟加载及异步(defer和async)

    一直以来写代码的时候的常用习惯就是吧所有的js文件直接加载在文档的head标签里面,在写js文件的时候有时候获取一些文件对象的时候为空对象,这是由于文档结构还没有加载完,但是js文件已经加载完.也就是 ...

随机推荐

  1. C#中利用双缓冲技术解决绘图闪屏问题。

    这段时间在做一个小型游戏,在界面显示的时候用到了一些图形.一开始涉及到的图形全都用控件的背景图片代替了.这样游戏运行的时候存在的一个很大的问题是游戏运行很慢.小组成员费尽周折,即将放弃,每一个成员都愁 ...

  2. Linux内核和根文件系统引导加载程序

    续博文<u-boot之u-boot-2009.11启动过程分析> Linux内核启动及文件系统载入过程 当u-boot開始运行bootcmd命令.就进入Linux内核启动阶段,与u-boo ...

  3. 做ACM该伤不起啊！！

    開始搞ACM啊!! ! .! ! ! ..! 从此踏上了尼玛不归路啊! !! !!! !!.!!! 谁特么跟劳资讲算法是程序设计的核心啊..! ! ! .  尼玛除了面试题就没见过用算法的地方啊!!! ...

  4. Linux C/C++计划Shell命令大杂烩（1）

    1, 请参见发行信息 cat /etc/issue 2, 查看内核版本号 uname -r 查看内核版本号 uname -p 查看处理器类型32bit/64bit uname -n 查看网络主机名(o ...

  5. JS读写Cookie（设置、读取、删除）

    JS读写Cookie(设置.读取.删除) Cookie是客户端存放数据的一种方式,可用来做状态保持. 1.设置Cookie: a.无过期时间:(若不设置过期时间,默认为会话级Cookie,浏览器关闭就 ...

  6. 当有多于64合乎逻辑的cpu时刻，Windows 下一个Oracle db 实例启动（startup）什么时候会hang（待定）

    Bug 9772171 - Database startup hangs on Windows when machine has more than 64 cores [ID 9772171.8] 该 ...

  7. getch()、getche()和getchar()函数

    原文:getch().getche()和getchar()函数 getch().getche()和getchar()函数(1) getch()和getche()函数 这两个函数都是从键盘上读入一个字符 ...

  8. java设计模式之六适配器模式(Adapter)

    适配器模式将某个类的接口转换成客户端期望的另一个接口表示,目的是消除由于接口不匹配所造成的类的兼容性问题.主要分为三类:类的适配器模式.对象的适配器模式.接口的适配器模式.首先,我们来看看类的适配器模 ...

  9. DB2数据类型

    DB2数据库的内置数据类型主要分成数值型(numeric).字符串型(character string).图形字符串(graphic string).二进制字符串型(binary string)或日期 ...

  10. thrift实现js与C#通讯

    利用thrift实现js与C#通讯的实例代码 1.为什么要用thrift js C#? 1.1 首先,js 通过 thrift 访问C#,实际上是一种c/s模式.thrift是通信工具,js是客户端, ...