大多数 javascript 和 Web 开发书籍/文章都说您必须将 CSS 放在 head 标记中，并将 javascript 放在页面底部。
但是当我打开诸如stackoverflow之类的著名网站的html源时，我发现他们在head标签中放了一些js文件。
这两种方法的优缺点是什么？何时使用哪种方法？
为同一问题找到另一个问题： Where should I declare JavaScript files used in my page? In <head></head> or near </body>?
【问题讨论】：
标签： javascript
在页面加载之前，头部中的任何 javascript 都会被评估，这意味着页面感觉需要更长的时间来加载。如果所有的 javascript 都在末尾，那么让事件正常工作会稍微困难一些，但是 jQuery 几乎可以为您解决这个问题。
【讨论】：
来自雅虎的Best Practices for Speeding Up Your Web Site：
脚本引起的问题是 他们阻止并行下载。这 HTTP/1.1 规范建议 浏览器下载不超过两个 每个主机名并行的组件。 如果您从多个 主机名，您可以获得两个以上 下载并行发生。尽管 一个脚本正在下载，但是， 浏览器不会启动任何其他 下载，即使在不同的 主机名。
在某些情况下，这并不容易 将脚本移至底部。如果，对于 例如，脚本使用 document.write 插入部分 页面内容，不能移动 在页面下方。也可能有 范围界定问题。在很多情况下，有 是解决这些问题的方法 情况。
另一种建议，通常 出现的是使用延迟脚本。 DEFER 属性表示 脚本不包含 document.write，是一个线索 他们可以继续的浏览器 渲染。不幸的是，火狐 不支持 DEFER 属性。 在 Internet Explorer 中，脚本可能 推迟，但不至于 想要的。如果可以推迟脚本， 也可以移到底部 这页纸。这将使您的网络 页面加载速度更快。
因此，一般情况下，最好将它们放在底部。然而，这并不总是可行的，而且它通常不会产生太大的影响。
【讨论】：
这真的取决于您的网站。如果您正在访问和调用正文中的 JavaScript 函数，则必须在标头中引用它以便加载。否则，如果您只在加载整个文档时调用 JavaScript，那么将 JavaScript 放在正文的末尾是明智的。通过将 .JS 文件放在最后，您可以加载整个页面，然后获取 .JS 文件。这样，用户将能够快速查看页面，并且当他/她熟悉页面时，.JS 文件已经下载。
【讨论】：
正如其他人所说，当您将 javascript 放在头部时，它会延迟页面的呈现，直到脚本加载后，这意味着页面可能需要更长的时间来加载 - 特别是如果您正在下载大型脚本文件。
如果您将脚本标签移动到页面末尾，您将确保浏览器在脚本标签之前下载图像和样式表，并且页面可能会在脚本开始运行之前呈现。这也意味着，如果您依赖脚本中的某些功能，则在页面对用户可见之后一段时间才能使用。
如果您要添加样式或元素（例如，使用某种形式的更丰富的编辑器切换文本字段），用户会看到闪烁。
如果您要向元素添加点击事件，它们将在元素本身可见之后才能被点击。
有时这些问题需要您将脚本放在头上，有时您可以将它们放在底部。
恕我直言（完全反对 YSlow 和许多聪明人），您应该将脚本保留在 head 标签中，并且大部分时间只依赖它们进行缓存。
【讨论】：
一般来说，您应该将脚本引用放在页面底部。脚本不仅需要下载，还必须在块被释放和页面继续渲染过程之前评估和执行。 Modernizr 之类的东西应该放在顶部，因为它会进行一些功能检测以及您可能想要的 HTML5 填充程序。
您想尝试将脚本放在页面底部的另一个原因是单点故障或 SPOF。这是脚本调用超时或由于某些其他原因阻止页面执行的地方。第三方广告库等经常会发生这种情况。
是的，您可能需要更加仔细地考虑如何构建应用程序，但我发现它对我来说很快就变得非常自然。在过去的 4 年里，我用底部的脚本构建了数百个 Web 应用程序，我可以分辨出其中的区别。我可能是 500 毫秒，也可能是 5000 毫秒，但这一切都很重要。
【讨论】：