<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和渲染浏览器同时进行

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

在chorme下的执行结果如下:

<script> 的defer和async的更多相关文章

  1. script的defer和async

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

  2. script标签defer与async的区别

    总结: async 会在文件下载完毕后立即执行 会阻止html parser defer 会下载完以后等html parser结束后执行,保证顺序

  3. javascript的defer和async的区别。

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

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

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

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

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

  6. defer和async的区别

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

  7. defer与async

    defer:该属性指定的脚本不会修改DOM,因此代码可以安全的延迟执行. 含defer属性的script标签可以放在任何位置,在页面解析到该script标签时,开始下载脚本,但不会执行脚本,直至DOM ...

  8. defer和async的详细区别

    看过javascript高级程序设计的人,在javascript高级程序设计里,应该看到了介绍了有关defer和async的区别,可是比较浅显,而且也说得不是很清楚.下面我们来通过图片来详细了解下df ...

  9. defer与async的区别

    当浏览器碰到 script 脚本的时候: <script src="script.js"></script> 没有 defer 或 async,浏览器会立即 ...

随机推荐

  1. Hibernate之集合映射的使用(Set集合映射,list集合映射,Map集合映射)

    a:数据库的相关知识: (1):一个表能否有多个主键:不能: (2):为什么要设置主键:数据库存储的数据都是有效的,必须保持唯一性: (3)为什么id作为主键:因为表中通常找不到合适的列作为唯一列,即 ...

  2. BZOJ1819 [JSOI]Word Query电子字典 Trie

    欢迎访问~原文出处——博客园-zhouzhendong 去博客园看该题解 题目传送门 - BZOJ1819 题意概括 字符串a与字符串b的编辑距离是指:允许对a或b串进行下列“编辑”操作,将a变为b或 ...

  3. HDU-2087-剪花布条 【KMP】(求模式串的匹配个数——与已匹配的字串不交)

    题目链接:https://vjudge.net/contest/220679#problem/C 剪花布条                                               ...

  4. 001.Open-Falcon简介

    一 Open-Falcon简介 监控系统是整个运维环节,乃至整个产品生命周期中最重要的一环,事前及时预警发现故障,事后提供翔实的数据用于追查定位问题.监控系统作为一个成熟的运维产品,相对成熟的解决方案 ...

  5. ReportNG报表显示中文乱码和TestNG显示中文乱码实力解决办法

    最近在进军测试自动化框架学习阶段,但无意间总是会伴随小问题的困扰,比如中文乱码,而导致显示总是不舒服,个人觉得,就一定要解决,似乎有点点强迫症.所以遇到ReportNG报表显示中文乱码和TestNG显 ...

  6. 618大促微服务、web、redis等的超时时间

    1. 最近因为大促原因线上服务不稳定,不稳定主要是redis经常超时并且数据为定时mGet方式获得 节点一多,所有服务节点同时获取数据访问量变大导致get取数据变慢因mGet会对数据进行锁住操作, 此 ...

  7. BZOJ4261 : 建设游乐场

    将图黑白染色,每个点拆成两个点,分别表示水平和竖直方向,再增加一个点以控制流量,那么每个格子都需要找两个方向去连接. $S$到每个黑点的控制点连边,流量$2$,费用$0$: 控制点向两个方向的点各连两 ...

  8. Java svnkit check update commit

    import java.io.File; import org.apache.log4j.Logger;import org.tmatesoft.svn.core.SVNCommitInfo;impo ...

  9. centos 终端界面代理设置

    一.centos自带界面设置代理 1. 界面设置 squid默认代理端口3128. 2. firefox设置 设置 -> 局域网设置 -> ip:port / username:passw ...

  10. Xshell配置ssh免密码登录-密钥公钥(Public key)与私钥(Private Key)登录【已成功实例】

    本文转自https://blog.csdn.net/qjc_501165091/article/details/51278696 ssh登录提供两种认证方式:口令(密码)认证方式和密钥认证方式.其中口 ...