JavaScript值延迟脚本和异步脚本
Html 4.0为<script>标签定义了defer属性，这个属性的用途是表名脚本在执行时,不会影响页面的构造。也就是说,脚本会延迟到整个页面解析完毕之后在运行,因此,在<script>元素中设置defer属性,相当于告诉浏览器立即下载,但延迟执行。但是有一种特殊情况,看如下代码：
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script src="aaa.js" defer="defer"></script>
<script src="bbb.js" defer="defer"></script>
</head>
<body>
<div id="div"></div>
</body>
</html>
上面代码有有两个外部脚本,且它们都被设置成延迟加载,HTML5的规范要求脚本按照他们出现的先后顺序执行,因此第一个延迟脚本会先于第二个延迟脚本执行,但是,事实并非如此,延迟脚本不一定会按照顺序执行,因此最好只包含一个延迟脚本！
异步脚本:
与defer类似,async只适用与外部脚本,并告诉浏览器立即下载文件，标记为async的脚本并不保证按照他们指定的先后顺序执行。如下代码:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script src="aaa.js" async></script>
<script src="bbb.js" async></script>
</head>
<body>
<div id="div"></div>
</body>
</html>
上面代码中的两个外部脚本文件,都被设置成异步加载的方式,但是第二个脚本问价可能会先于第一个脚本文件之前执行。因此,确保两者之间互不用来非常重要。
JavaScript值延迟脚本和异步脚本的更多相关文章
- 原生 JS 中 延迟脚本和异步脚本
一.延迟脚本 defer HTML4.0中为<script> 标签添加了个defer属性.属性的用途是表民脚本在执行时不会影响页面的构造. 脚本会被延迟到页面加载完毕的时候,执行.也就是当 ...
- JavaScript <script>标签的位置、延迟脚本（defer属性）与 异步脚本（async属性）
一.<script>标签的位置 传统的做法是将<script>元素放在<head>元素中,例如: <!DOCTYPE html><html > ...
- js异步脚本
1.延迟脚本 HTML4.01为<script>标签定义了defer属性,为了表明脚本在执行时不会影响页面的构造.也就是说,脚本会在整个页面都解析完毕后再运行.因此在<script& ...
- 浏览器环境下JavaScript脚本加载与执行探析之动态脚本与Ajax脚本注入
在<浏览器环境下JavaScript脚本加载与执行探析之defer与async特性>中,我们研究了延迟脚本(defer)和异步脚本(async)的执行时机.浏览器支持情况.浏览器bug以及 ...
- JavaScript 文件延迟和异步加载
JavaScript 文件延迟和异步加载 -般情况下,在文档的 <head> 标签中包含 JavaScript 脚本,或者导入的 JavaScript 文件. 这意味着必须等到全部 Jav ...
- JavaScript学习10：动态载入脚本和样式
我们在写Web页面的时候,须要引入非常多的JavaScript脚本文件和CSS样式文件,尤其是在站点需求量非常大的时候,脚本的需求量也随之变大,这样一来,站点的性能就会大打折扣.因此就出现了动态载入的 ...
- loadrunner脚本中写入脚本输出log到外部文件,分析参数取值方式
loadrunner脚本中写入脚本输出log到外部文件,分析参数取值方式 分类: 心得 loadrunner 我的测试 2012-04-01 12:52 2340人阅读 评论(0) 收藏 举报 脚本l ...
- javascript 同步加载与异步加载
HTML 4.01 的script属性 charset: 可选.指定src引入代码的字符集,大多数浏览器忽略该值. defer: boolean, 可选.延迟脚本执行,相当于将script标签放入页面 ...
- JavaScript 学习笔记之线程异步模型
核心的javascript程序语言并没有包含任何的线程机制,客户端javascript程序也没有任何关于线程的定义,事件驱动模式下的javascript语言并不能实现同时执行,即不能同时执行两个及以上 ...
随机推荐
- jQuery ui背景色动态渐变导航菜单
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 在JavaScript的数组中进行数组元素查找和替换(JS的indexOf等)
<html> <head> <title> Extend JavaScript Array Method </title> <script lan ...
- Fix The thread xxx has exited with code 259 (0×103)
When run the test case in VS2013, you may encounter below problem After test case end, it will show ...
- DEV控件自定义排序实现
一般的控件或者组件都支持按照某一列进行排序.但是,这种排序是根据数据源里的数据默认按照降序或升序排序的,同时这样的排序与字段的类型有关. 假设现在字段的类型是字符串类型 ,但是,存储的数据时数字加一些 ...
- (转)详解汇编系统调用过程（以printf为例）
本文以printf为例,详细解析一个简单的printf调用里头,系统究竟做了什么,各寄存器究竟如何变化. 环境: linux + gnu as assembler + ld linker 如何在汇编调 ...
- Oracle学习之Oracle 树操作(select…start with…connect by…prior)
转自:http://www.cnblogs.com/linjiqin/archive/2013/06/24/3152674.html oracle树查询的最重要的就是select…start with ...
- Swift 基本数据类型
Swift 1,Swift支持所有C和Objective-C的基本类型,支持面向过程和面向对象的编程机制. 2,Swift提供了两种功能强劲的集合类型:数组和字典. 3,元组. 4,可选类型. 5,S ...
- Android 6.0 以及HttpClient
Android 6.0 SDK,API Level 是 23.更新之后,就可以修改 compileSdkVersion 和targetSdkVersion 到 23 体验新的特性了. 同时 Andro ...
- 服务端NETTY 客户端非NETTY处理粘包和拆包的问题
之前为了调式和方便一直没有处理粘包的问题,今天专门花了时间来搞NETTY的粘包处理,要知道在高并发下,不处理粘包是不可能的,数据流的混乱会造成业务的崩溃什么的我就不说了.所以这个问题 在我心里一直是个 ...
- rsyslog masg和rawmsg的区别
msg the MSG part of the message (aka "the message" ;)) message 的MSG 部分 rawmsg the message ...