async：加载和渲染后续文档元素的过程将和 script.js 的加载与执行并行进行（异步），先输入大量内容避免内容少看不到效果。

defer：加载后续文档元素的过程将和 script.js 的加载并行进行（异步），但是 script.js 的执行要在所有元素解析完成之后，通俗说就是全部的文章内容如div等已加载并css渲染完毕后，网页已经出现想要的效果之后，defer修饰的js才会运行，才会弹出窗口。

运行，测试使用的是谷歌浏览器和360安全浏览器。

按照正常的流程，应该是文字图片加载一半，async弹窗弹出，点击确定后，文字图片显示完全，文档元素完成全部的加载，接着defer弹窗才弹出。

测试时，有时会出现async弹窗出现，但没有图中文字内容加载一半的情况，多试几次成功，async功能完成验证。但是无论测试多少次，defer弹窗每次都会第一个弹出，且无论defer和async位于head中，谁前谁后，都不影响测试的结果。

接着通过查阅资料，翻看教辅，看到了这么一张表格，兼容性。

可以判断，defer属性在谷歌浏览器和360安全浏览器中并没有真正地起效果，和没有加defer一样。

那就能解释之前为什么defer先加载，且无论先后。因为它就相当于一个普通无修饰的script命令，按照从上往下，从左往右的顺序运行，它被优先执行了，async则需要等待文章元素进行加载时才能加载和运行。

找到原因，那么就用IE浏览器进行测试，一切正常，async伴随着文章内容出现，紧接着文章加载完毕（这一幕试了好多次没成功，因为每次文章都全加载完了同时async也跳了出来，可能是文章加载内容太少，观察不到），defer弹窗弹出。

不过至少证明了defer在IE上是的确有效果的，且运行在async之后，如果理解有偏差，麻烦老师纠正下，这个真的听视频听的很迷。