DOMContentLoaded

　　JS的加载、执行是两个阶段（defer、async可以看出）

　　DOMContentLoaded事件只关注HTML是否被解析完，而不管async脚本

　　HTML文档被解析时，如果遇见defer脚本，则在后台加载脚本，文档解析过程不中断，而等文档解析结束后，defer脚本执行（defer脚本的执行顺序于定义时的位置有关）。DOMContentLoaded在defer脚本执行结束后才会被触发。

　　HTML文档被解析时，如果遇见async脚本，则在后台加载脚本，文档解析过程不中断，脚本加载完成后，文档停止解析，执行结束后文档继续解析。DOMContentLoaded事件只关注HTML是否被解析完，不需要等待async脚本执行、样式表加载等（DOMContentLoaded本身不会的等待CSS文件、图片。iframe文件完成）。

 

（蓝色线代表网络读取，红色线代表执行时间，这两个都是针对脚本的；绿色线代表 HTML 解析）

 

　　defer和async在网络读取（脚本加载）都为异步（相对于HTML解析），主要区别是，脚本下载完后何时执行。