1.没有defer或async
浏览器遇到脚本的时候会暂停渲染并立即加载执行脚本（外部脚本），“立即”指的是在渲染该 script 标签之下的文档元素之前，也就是说不等待后续载入的文档元素，读到就加载并执行。因此如果将JS脚本放置在head的话会产生阻塞，并且脚本当中对于DOM的操作也会出现报错，因为还没有生成。
2.有async过程如下：
1.浏览器开始解析网页
2.解析过程中，发现带有async属性的script标签
3.浏览器继续往下解析 HTML 网页，同时并行下载外部脚本
4.脚本下载完成，浏览器暂停解析网页，开始执行下载的脚本
5.脚本执行完毕，浏览器恢复解析网页
3.有defer过程如下：
1.浏览器开始解析网页
2.解析过程中，发现带有defer属性的脚本元素
3.浏览器继续往下解析网页，同时并行下载脚本元素加载的外部脚本
4.浏览器完成解析网页，此时再回过头执行已经下载完成的脚本
4.defer还是async？
两者之间的选择则是看脚本之间是否有依赖关系，有依赖的话应当要保证执行顺序，应当使用defer没有依赖的话使用async，同时使用的话defer失效。要注意的是两者都不应该使用document.write,这个导致整个页面被清除。
详细的过程对比参考下图：