本文介绍了HTML中script标签的defer和async属性，如何影响脚本的下载和执行，以及它们在DOM加载、DOMContentLoaded和load事件中的行为。defer确保脚本延迟至页面解析完毕后执行，而async允许脚本异步加载，可能乱序但保证在load事件前执行。
从极迷处识迷，则到处醒；将难放怀一放，则万境宽。——《小窗幽记·集醒篇》
译：在最易令人迷惑的地方识破迷惑，那么无处不是清醒的状态；将最难以放下心怀的事放下，那么到处都是宽广的路。
开始
将Javascript插入HTML的主要方法是使用script元素，
外部引入——通过src属性指定外部JavaScript文件链接
内部嵌入——直接在HTML文档内使用<script></script>标签对引入
<script>标签包含了两个特殊的属性：defer与async，
async：属性可选。表示应该立即开始下载脚本，但不能阻止其他页面动作，比如下载资源或等待其他脚本加载。只对外部脚本有效。
defer：属性可选。表示脚本可以延迟到文档完全被解析和显示之后再执行。只对外部脚本文件有效。在IE7及更早的版本中，对行内脚本也可以指定这个属性。
——JavaScript高级程序设计
如果没有 defer 和 async 属性，浏览器会立即加载并执行相应的外部脚本，“立即”指的是在渲染该 script 标签之下的（下面的、下文的、紧接着的、紧跟着的、后续的）文档元素之前，也就是说不等待载入后续的文档元素，读到脚本就加载并执行。这样就阻塞了后续文档的加载。
推迟执行脚本 defer（延迟、推迟）
HTML 4.01 为<script>元素定义了一个叫 defer 的属性。这个属性表示脚本在执行的时候不会改变页面的结构。也就是说，脚本会被延迟到整个页面都解析完毕后再运行。因此，在<script>元素上
设置 defer 属性，相当于告诉浏览器立即下载，但延迟执行。
<!DOCTYPE html>
<html>
<head>
<title>Example HTML Pa
最低0.47元/天 解锁文章
扫一扫
4421
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
