脚本元素阻塞在头部但不阻塞在正文中答案

【问题标题】：Script element block in head but don't block in body脚本元素阻塞在头部但不阻塞在正文中
【发布时间】：2014-04-13 06:02:03
【问题描述】：

我使用 cuzillion 构建了一个 page，头部带有 script 元素：

<head>
    <script></script>
</head>
<body>
    <img />
    <img />
    <img />
    <img />
</body>

此脚本元素加载延迟 2 秒，执行需要 3 秒。当我在 Chrome 中加载此页面时，网络显示网络状态：

显然加载脚本会阻止解析器解析正文中的图像。加载脚本后必须加载图像

（可能你提到有一个预先加载的图像。我认为这是因为webkit preloader触发）。

<body>
   <img/>
   <img/>
   <script></script>
   <img/>
   <img/>
</body>

它不会阻止它下面的图像加载：

但是为什么呢？为什么脚本在头部而不是在正文中？有什么区别？

【问题讨论】：

【解决方案1】：

如果您正在获取外部脚本，您可以使用 async 属性告诉浏览器并行获取它。

【讨论】：