码迷,mamicode.com
首页 > 其他好文 > 详细

<script> 的defer和async

时间:2014-09-02 22:33:55      阅读:163      评论:0      收藏:0      [点我收藏+]

标签:style   blog   http   color   使用   java   ar   2014   div   

<script src="../file.js" async="async"></script>

file.js----

仅仅只有alert("hello,world");

 

async 属性仅适用于外部脚本(只有在使用 src 属性时)。

有多种执行外部脚本的方法:

  • 如果 async="async":脚本相对于页面的其余部分异步地执行(当页面继续进行解析时,脚本将被执行)
  • 如果不使用 async 且 defer="defer":脚本将在页面完成解析时执行
  • 如果既不使用 async 也不使用 defer:在浏览器继续解析页面之前,立即读取并执行脚本
<html> 
 <head> 
<script type="text/javascript" src="file.js" async="async"></script> 
</head>
<body>
<div style="height:100px;width:100px;background-color:#000000">
</div>

 </body> 
</html>

 在IE8下执行代码并没有体现异步的功能,执行顺序为:

(1)弹出 hello,world

(2)关闭 "hello,world"后渲染BOM界面

将相同的代码在chorme中进行执行,体现异步特性,即弹出hello,world和渲染浏览器同时进行

bubuko.com,布布扣

关闭【确定】按钮后执行页面如下:

bubuko.com,布布扣

在chorme下的执行结果如下:

bubuko.com,布布扣

 

<script> 的defer和async

标签:style   blog   http   color   使用   java   ar   2014   div   

原文地址:http://www.cnblogs.com/CBDoctor/p/3952343.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!