您的位置：首页 > Web前端 > HTML

HTML 5 <script> async 属性简单设置代码异步执行

2017-02-21 17:04 507 查看

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修改地址栏而不刷新页面（二）

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航