<script>, <script async>, <script defer> 三种标签的区别

<script>, <script async>, <script defer> 三种标签的区别

1. <script>标签

   • 阻塞html parsing
   • 脚本将会立即被请求和执行
   • 脚本执行完毕后, 继续进行html parsing

2. <script async>标签

   • 脚本的请求将会和html parsing 并行执行
   • 脚本请求完成后将会立即执行(此时可能html parsing并未完成)
   • 当此脚本与其他脚本无关时使用

3. <script defer>标签

   • 脚本的请求将会和html parsing 并行执行
   • 当html parsing 结束后才会执行脚本
   • 如果有多个<script defer>标签, 它们将按照它们出现的顺序依次执行

4. 注意

   • 如果<script>标签中没有src属性, async和defer将会被忽略