【JS】defer / async
引用JavaScript文件时的两个属性defer和async
<script src="js1.js" defer></script>
<script src="js2.js" async></script>
defer 延迟脚本
立即下载,延迟执行
这个属性的用途是表明脚本在执行时不会影响页 面的构造。也就是说,脚本会被延迟到整个页面都解析完毕后再运行
HTML5 规范要求脚本按照它们出现的先后顺序执行,因此第一个延迟脚本会先于第二个延迟脚本执行,而这两个脚本会先于 DOMContentLoaded 事件执行。
在现实当中,延迟脚本并不一定会按照顺序执行,也不一定会在 DOMContentLoaded 事件触发 前执行,因此最好只包含一个延迟脚本
IE4、Firefox 3.5、Safari 5 和 Chrome 是最早支持 defer 属性的浏览器。其他浏览器会忽略这个属 性,像平常一样处理脚本。为此,把延迟脚本放在页面底部仍然是最佳选择
async 异步脚本
立即下载,立即执行
指定 async 属性的目的是不让页面等待两个脚本下载和执行,从而异步加载页面其他内容
标记为 async 的脚本并不保证按照指定它们的先后顺序执行
异步脚本一定会在页面的 load 事件前执行,但可能会在 DOMContentLoaded 事件触发之前或之 后执行。
支持异步脚本的浏览器有 Firefox 3.6、Safari 5 和 Chrome
http://www.cnblogs.com/jzm17173/p/3619621.html
【JS】defer / async的更多相关文章
- -_-#【JS】defer / async
引用JavaScript文件时的两个属性defer和async <script src="js1.js" defer></script> <scrip ...
- 【js】appendChild
appendChild主要是用来追加节点插入到最后:循环的时候由于不停的搬家导致length在改变. 使用for循环 <!Doctype html> <html xmlns= ...
- 【JS】AJAX跨域-被调用方与调用方解决方案(二)
解决跨域问题 跨域问题说明,参考[JS]AJAX跨域-JSONP解决方案(一) 实例,使用上一章([JS]AJAX跨域-JSONP解决方案(一))的实例 解决方案三(被调用方支持跨域-服务端代码解决) ...
- 【js】Leetcode每日一题-制作m束花所需的最少天数
[js]Leetcode每日一题-制作m束花所需的最少天数 [题目描述] 给你一个整数数组 bloomDay,以及两个整数 m 和 k . 现需要制作 m 束花.制作花束时,需要使用花园中 相邻的 k ...
- 【js】Leetcode每日一题-完成所有工作的最短时间
[js]Leetcode每日一题-完成所有工作的最短时间 [题目描述] 给你一个整数数组 jobs ,其中 jobs[i] 是完成第 i 项工作要花费的时间. 请你将这些工作分配给 k 位工人.所有工 ...
- 【js】Leetcode每日一题-数组异或操作
[js]Leetcode每日一题-数组异或操作 [题目描述] 给你两个整数,n 和 start . 数组 nums 定义为:nums[i] = start + 2*i(下标从 0 开始)且 n == ...
- 【js】Leetcode每日一题-解码异或后数组
[js]Leetcode每日一题-解码异或后数组 [题目描述] 未知 整数数组 arr 由 n 个非负整数组成. 经编码后变为长度为 n - 1 的另一个整数数组 encoded ,其中 encode ...
- 【js】Leetcode每日一题-叶子相似的树
[js]Leetcode每日一题-叶子相似的树 [题目描述] 请考虑一棵二叉树上所有的叶子,这些叶子的值按从左到右的顺序排列形成一个 叶值序列 . 举个例子,如上图所示,给定一棵叶值序列为 (6, 7 ...
- 【js】Leetcode每日一题-子数组异或查询
[js]Leetcode每日一题-子数组异或查询 [题目描述] 有一个正整数数组 arr,现给你一个对应的查询数组 queries,其中 queries[i] = [Li, Ri]. 对于每个查询 i ...
随机推荐
- erase() 返回的是删除此元素之后的下一个元素的迭代器 .xml
pre{ line-height:1; color:#f0caa6; background-color:#2d161d; font-size:16px;}.sysFunc{color:#e54ae9; ...
- C++中 类的构造函数理解(一)
C++中 类的构造函数理解(一) 写在前面 这段时间完成三个方面的事情: 1.继续巩固基础知识(主要是C++ 方面的知识) 2.尝试实现一个iOS的app,通过完成app,学习iOS开发中要用到的知识 ...
- pycharm出现乱码
1. 'gbk' codec can't encode character u'\xb8' 解决办法 import sys reload(sys)sys.setdefaultencoding('utf ...
- NSRangeFromString 测试
官网文档 Returns a range from a textual representation. Declaration SWIFT func NSRangeFromString(_ aStri ...
- hadoop2.5.2学习及实践笔记(二)—— 编译源代码及导入源码至eclipse
生产环境中hadoop一般会选择64位版本,官方下载的hadoop安装包中的native库是32位的,因此运行64位版本时,需要自己编译64位的native库,并替换掉自带native库. 源码包下的 ...
- Mapreduce执行过程分析(基于Hadoop2.4)——(二)
4.3 Map类 创建Map类和map函数,map函数是org.apache.hadoop.mapreduce.Mapper类中的定义的,当处理每一个键值对的时候,都要调用一次map方法,用户需要覆写 ...
- jquery对象和js对象,以及它们的互相转换
jq对象无法使用DOM对象的方法,互相都不能用 ***jq对象转换成DOM对象的2中方法 1.$('div')[0下标]:jq对象是类似数组对象有长度,所以可以通过下标查找到它的DOM对象 2.$(' ...
- Spark RDD概念学习系列之RDD的操作(七)
RDD的操作 RDD支持两种操作:转换和动作. 1)转换,即从现有的数据集创建一个新的数据集. 2)动作,即在数据集上进行计算后,返回一个值给Driver程序. 例如,map就是一种转换,它将数据集每 ...
- (mac)Android Studio安装以及Fetching android sdk component information超时的解决方案
解决Mac下面Fetching android sdk component information加载过久问题, 关于windows中可以参考前面一篇文章 关于安装和下载可以百度一下地址.安装完成后, ...
- TcxGrid导出EXCEL
function ExportExcel(grid: TcxGrid; const fileName: string = '1.xls'): Boolean;var sd: TSaveDialog; ...