<script> 标签的位置
1.放到<head>标签内，所有放到其中的javascript代码都必须先下载、解析和解释完成后才开始渲染页面
2.放到<body>标签的页面内容后面，处理javascript代码前先渲染页面
推迟执行脚本
<script defer src="example1.js"></script> //立即下载，但延迟到整个页面都解析完毕后执行
<script defer src="example2.js"></script>
html5规范要求脚本应该按照它们出现的顺序执行，因此第一个被延迟的脚本应该在第二个被延迟的脚本之前执行，但两者都应该在DOMContentLoaded事件之前执行。但实际中被延迟的脚本不一定按顺序执行或在DOMContentLoaded事件之前执行，因此最好只包含一个带defer属性的脚本
html5明确规定，defer属性只对外部文件有效，会忽略行内脚本的defer属性
可以把需要延时执行的脚本放到<body>标签的页面内容后面，以替代defer属性
异步执行脚本
<script async src="example.js"></script>
<script>的async属性，只对外部脚本有效 //立即下载，但不阻止其他页面动作
与defer不同的是，标记为async的脚本并不保证按它们出现的顺序执行，因此它们之间不能有依赖关系
async告诉浏览器不必等到脚本下载和执行完后加载页面，同样也不必等脚本加载和执行完后加载其他脚本
async不应该在加载期间修改DOM
异步脚本保证会在页面的load事件之前执行，但可能会在DOMContentLoaded之前或之后
使用async也会告诉页面你不会使用document.write
原文：https://www.cnblogs.com/songqt/p/14084478.html