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 <a>标签download 属性

HTML5 History对象,Javascript修改地址栏而不刷新页面(二)

HTML 5 <script> async 属性简单设置代码异步执行的更多相关文章

  1. 常用代码之二:使用BackgroundWorker或Task让代码异步执行。

    先要引用System.ComponentModel using System.ComponentModel; 然后创建backgroundworker private void backgroundW ...

  2. JS文件延迟和异步加载:defer和async属性

    -般情况下,在文档的 <head> 标签中包含 JavaScript 脚本,或者导入的 JavaScript 文件.这意味着必须等到全部 JavaScript 代码都被加载.解析和执行完以 ...

  3. 1关于script标签属性,注意点,浏览器文档模式,各种数据类型的转化

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. JavaScript <script>标签的位置、延迟脚本(defer属性)与 异步脚本(async属性)

    一.<script>标签的位置 传统的做法是将<script>元素放在<head>元素中,例如: <!DOCTYPE html><html > ...

  5. 异步加载script,提高前端性能(defer和async属性的区别)

    一.异步加载script的好处 为了加快首屏响应速度,前端会采用代码切割.按需加载等方式优化性能.异步加载script也是一种前端优化的手段. 就好比如果我的页面其中一个功能需要打开地图,但是地图的j ...

  6. html5中script的async属性

    html5中script的async属性 我兴奋于html5的原因之一是一些久久未能实现的特性现在可以真正运用于实际项目中了. 如我们使用placeholder效果蛮久了但是那需要javascript ...

  7. script标签中defer和async属性的区别

    这篇文章来源于JS高级程序设计第三版中关于script标签的介绍,结合查阅的资料写下的学习笔记. 向html页面中插入javascript代码的主要方法就是通过script标签.其中包括两种形式,第一 ...

  8. HTML5中script的async属性异步加载JS

    HTML5中script的async属性异步加载JS     HTML4.01为script标签定义了5个属性: charset 可选.指定src引入代码的字符集,大多数浏览器忽略该值.defer 可 ...

  9. HTML <script> 标签的 defer 和 async 属性

    HTMKL <script>标签中有defer和async属性,简单介绍一下两者的区别吧.   普通的script标签会让浏览器立即下载并执行完毕,执行也是按照先后顺序,再进行后面的解析. ...

随机推荐

  1. Vue.js开始第一个项目

    前端架构之路:使用Vue.js开始第一个项目   Vue.js做为目前前端最热门的库之一,为快速构建并开发前端项目多了一种思维模式.本文通过一个简单的实例开始上手Vue.js开发. 一.技术准备 使用 ...

  2. 【LOJ】#2549. 「JSOI2018」战争

    题解 仔细分析了一下,如果写个凸包+每次暴力半平面交可以得到70分,正解有点懵啊 然后用到了一个非常结论,但是大概出题人觉得江苏神仙一个个都可以手证的结论吧.. Minkowski sum 两个凸包分 ...

  3. Thinkphp分布式数据库连接代码分析

    Thinkphp作为国内的一款流行框架,相信使用的人一定不在少数.本篇我们来分析一下Thinkphp中比较重要的一部分——分布式数据库的连接. 当然了,我们在这里不是去将如何使用模型去对数据库进行增删 ...

  4. 017.Zabbix宏介绍

    一 宏介绍 Zabbix宏的作用是便于在模板.Items.Trigger中的引用,名称为{$名称},宏的字符范围为:A~Z/0~9/_. 如:net.tcp.service[ssh,{$SSH_POR ...

  5. 七夕情人节表白-纯JS实现3D心形+图片旋转

    七夕情人节就快到了,这里献上纯js表白神器-心里都是你,预览: 技术点:css-3d.js-随机色.js-transform 1.html: <div class="heart&quo ...

  6. 用yum安装JDK

    用yum安装JDK 1.查看yum库中都有哪些jdk版本(暂时只发现了openjdk) [root@localhost ~]# yum search java|grep jdkldapjdk-java ...

  7. codevs 2804 最大最小数质因数

    题目描述 Description 先输入n,n<=20;再依次输入n个不同的数,每个数<=1000000;找出最大数和最小数,并输出最大最小数的质因数,没有质因数则输出0. 输入描述 In ...

  8. [ZOJ3781]Paint the Grid Reloaded

    思路: 先用DFS缩点,然后BFS找出每个点出发能到达的最长路,取$min$. 注意多组数据,初始化一定要仔细,刚开始存边的$e$忘记初始化,一直WA,调了半个晚上. 一开始和网上的题解对拍$T=1$ ...

  9. java使用代理模拟http get请求

    直接上代码: import java.io.BufferedReader; import java.io.InputStreamReader; import java.net.InetSocketAd ...

  10. centos 7下安装MySQL5.7 的安装和配置

    原文链接:  http://blog.csdn.net/xyang81/article/details/51759200 安装环境:CentOS7 64位 MINI版,安装MySQL5.7 1.配置Y ...