HTML <script> 标签的 async 属性 详解
HTML基础 2022-06-02 12:06:55小码哥的IT人生shichen
HTML <script> 标签的 async 属性
实例
将在可用时立即异步运行的脚本：
<script src="demo_async.js" async></script>
完整实例【亲自试一试】：
<!DOCTYPE html>
<html>
<body>
<h1>script async 属性</h1>
<p id="p1">Hello World!</p>
<script src="/demo/tags/demo_async.js" async></script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
定义和用法
async 属性是布尔属性。
如果已设置，它规定脚本将在可用时立即异步执行。
注释：async 属性仅适用于外部脚本（并且仅应在存在 src 属性时使用）。
注释：有几种可以执行外部脚本的方法：
- 如果 async="async"：脚本相对于页面的其余部分异步地执行（当页面继续进行解析时，脚本将被执行）
- 如果不使用 async 且 defer="defer"：脚本将在页面完成解析时执行
- 如果既不使用 async 也不使用 defer：在浏览器继续解析页面之前，立即读取并执行脚本
HTML 4.01 与 HTML 5 之间的差异
async 属性是 HTML5 中的新属性。
浏览器支持
表格中的数字注明了完全支持该属性的首个浏览器版本。
| 属性 | Chrome | Internet Explorer / Edge | Firefox | Safari | Opera |
|---|---|---|---|---|---|
| async | 8.0 | 10.0 | 3.6 | 5.1 | 15.0 |
语法
<script async>