Skip to content

script 标签放在 head 和 body 中的区别?

  1. 放在 <head> 中:

    • 阻塞渲染:浏览器解析到 <script> 时会暂停 HTML 解析,立即下载并执行脚本,导致页面渲染延迟(白屏时间增长)。
    • ​DOM 未就绪:若脚本直接操作 DOM,需通过 DOMContentLoaded 事件监听确保 DOM 解析完成。
  2. 放在 <body> 底部:

    • 页面内容优先渲染
    • DOM 就绪:可直接操作 DOM。

基于 MIT 许可发布