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

2023-10-17 09:56:51 浏览数 (2)

<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属性, asyncdefer将会被忽略

0 人点赞