HTML 5 <script> async 属性简单设置代码异步执行
HTML5中 script标签支持脚本的异步执行async。
脚本将会异步运行:
<script type="text/javascript" src="demo_async.js" async="async"></script>
定义和用法
async 属性规定一旦脚本可用,则会异步执行。
注释:async 属性仅适用于外部脚本(只有在使用 src 属性时)。
注释:有多种执行外部脚本的方法:
- 如果 async="async":脚本相对于页面的其余部分异步地执行(当页面继续进行解析时,脚本将被执行)
- 如果不使用 async 且 defer="defer":脚本将在页面完成解析时执行
- 如果既不使用 async 也不使用 defer:在浏览器继续解析页面之前,立即读取并执行脚本
测试如下:
1.Demo.html
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<title>Document</title>
</head> <body>
<script src='../Scripts/js1.js' async></script>
<script>
console.info('html文件执行');
</script>
</body> </html>
2.js1.js
(function(){
console.info('js文件执行');
alert(3);
})();
显示结果:

特别说明:
1.这种方式可以简单实现脚本的异步执行,但是不影响加载
2.这种方式,不能更好的控制在指定文件加载成功后,处理其他操作
3.如果想实现脚本等异步加载推荐使用RequireJS:RequireJS实例
更多:
HTML表单元素中disabled的元素的值不会提交到服务器
HTML5 History对象,Javascript修改地址栏而不刷新页面(二)
HTML 5 <script> async 属性简单设置代码异步执行的更多相关文章
- 常用代码之二:使用BackgroundWorker或Task让代码异步执行。
先要引用System.ComponentModel using System.ComponentModel; 然后创建backgroundworker private void backgroundW ...
- JS文件延迟和异步加载:defer和async属性
-般情况下,在文档的 <head> 标签中包含 JavaScript 脚本,或者导入的 JavaScript 文件.这意味着必须等到全部 JavaScript 代码都被加载.解析和执行完以 ...
- 1关于script标签属性,注意点,浏览器文档模式,各种数据类型的转化
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- JavaScript <script>标签的位置、延迟脚本(defer属性)与 异步脚本(async属性)
一.<script>标签的位置 传统的做法是将<script>元素放在<head>元素中,例如: <!DOCTYPE html><html > ...
- 异步加载script,提高前端性能(defer和async属性的区别)
一.异步加载script的好处 为了加快首屏响应速度,前端会采用代码切割.按需加载等方式优化性能.异步加载script也是一种前端优化的手段. 就好比如果我的页面其中一个功能需要打开地图,但是地图的j ...
- html5中script的async属性
html5中script的async属性 我兴奋于html5的原因之一是一些久久未能实现的特性现在可以真正运用于实际项目中了. 如我们使用placeholder效果蛮久了但是那需要javascript ...
- script标签中defer和async属性的区别
这篇文章来源于JS高级程序设计第三版中关于script标签的介绍,结合查阅的资料写下的学习笔记. 向html页面中插入javascript代码的主要方法就是通过script标签.其中包括两种形式,第一 ...
- HTML5中script的async属性异步加载JS
HTML5中script的async属性异步加载JS HTML4.01为script标签定义了5个属性: charset 可选.指定src引入代码的字符集,大多数浏览器忽略该值.defer 可 ...
- HTML <script> 标签的 defer 和 async 属性
HTMKL <script>标签中有defer和async属性,简单介绍一下两者的区别吧. 普通的script标签会让浏览器立即下载并执行完毕,执行也是按照先后顺序,再进行后面的解析. ...
随机推荐
- C++Primer,C++标准IO库阅读心得
IO 标准库类型和头文件 iostream istream 从流中读取 ostream 写到流中去 iostream 对流进行读写:从 istream 和 ostream 派生而来fstream if ...
- 007 jquery过滤选择器-----------(屬性过滤选择器)
1.介紹 2.程序 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> < ...
- .NET工作准备--01前言
01应聘须知(已过时) -1.了解软件开发大环境.-2.准备简历:不宜超过一页,永远准备中文,模板. -3.渠道:3大网站,中华英才,前程无忧(51job最给力),智联招聘.现在还有猎聘网和100程序 ...
- rabbitmq学习(四) —— 发布订阅
为了说明这种模式,我们将建立一个简单的日志系统.这个系统将由两个程序组成,第一个将发出日志消息,第二个将接收并处理日志消息.在我们的日志系统中,每一个运行的接收程序的副本都会收到日志消息. 交换器(E ...
- 使用 IntraWeb (23) - 基本控件之 TIWTimer、TIWProgressBar、TIWProgressIndicator、TIWTimeEdit
TIWTimer //和 TTimer 没多大区别, 它的默认事件现在是异步的(OnAsyncTimer), 在网络上使用 OnTimer 肯定是非常糟糕的 TIWProgressBar //进度条 ...
- 使用 IntraWeb (2) - Hello IntraWeb
IntraWeb 比我相像中的更贴近 VCL, 传统的非可视组件在这里大都可用(其内部很多复合属性是 TStringList 类型的), 它的诸多可视控件也是从 TControl 继承下来的. 这或许 ...
- Scrum:The Definition of Done —— 作业有没有写完呢?
Scrum:The Definition of Done -- 作业有没有写完呢?_苗得雨_新浪博客 http://blog.sina.com.cn/s/blog_59450ffc0102eiai.h ...
- Unity3D使用碰撞体做触发器实现简单的自己主动开门
在游戏制作中触发器的使用很的方便也很有用. 这一张我们简介一下怎样使用一个简单的触发器来实现自己主动开门关门的效果. 首先确保你已经对门进行了动画的设置. 详细流程例如以下. 选择Window- ...
- ARM Memory Copy
MODULE ARM_MEMORY PUBLIC ARM_MEMCPY PUBLIC ARM_MEMSET PUBLIC ARM_MEMSET8 PUBLIC ARM_MEMSET16 PUBLIC ...
- Access restriction: The method XXX from the type XXX is not accessible due to restriction XXX
插件重构的时候 遇到这个问题 Access restriction: The method setDefaultAutoCommit(boolean) from the type BasicDataS ...