关于“把SCRIPT放在最底层”的建议

Question

我已经阅读了有关将SCRIPT放在底部的建议（例如Is "Put Scripts at the Bottom" Correct?），我理解这个概念。

然而，我有一个疑问。

如果我有一个OnClick甚至调用一个JS函数，如果没有加载javascript包含文件将失败。我可以解决这个问题，但它很复杂。

我的想法是，在第一页加载后，脚本将被缓存在客户端的浏览器中，因此在第一页之后，对于我放置SCRIPT include指令的性能没有任何区别，但它可能会对我的OnClick事件产生影响。

我可以看到在第一页上加载一些巨大的Javascript库会很慢，可能导致一些/很多用户“点击”。但是对于第二页起，在页面末尾有脚本有什么好处吗？

我会感激任何澄清，以防我真的很厚，忽略了重要的事情;感谢。

Answer 1

放置脚本的位置并不重要，特别是如果你使用带有正确onPageLoad事件的JS框架（比如jQuery的ready（））

但是，对于外部加载的脚本，如分析代码，广告等。将它们放在页面底部非常重要。这是因为即使用户启用了缓存，缓存也会刷新，一些脚本会使用iframe加载其内容而不进行缓存（即广告）。如果这些没有放在页面的底部，那么浏览器会挂起加载它们，而且通常情况下，它们所在的服务器响应速度很慢。

Answer 2

您应该将自己的脚本放在头部，将外部脚本放在页面末尾。

如果您的服务器工作正常，内部脚本将快速加载，因此它们的加载时间几乎不会显着。如果您的服务器速度很慢，那么该页面将与加载脚本一样慢，因此在加载它们时它们没有太大区别。

您从其他服务器加载的脚本有时加载速度很慢，这就是您希望它们在页面末尾的原因，以便您的页面不会依赖它们。

不久之前，我们在页面上移动了一些外部脚本，以便在表单的结束标记之后加载它们，这使得用户即使外部脚本尚未加载也能够发布表单。

Answer 3

例如，在jQuery中，您可以添加一个ready()事件，该事件将在页面准备好时触发。这样，事件可以调用在文件末尾加载的函数。这种方式不是很复杂或困难。

我认为将脚本标记放在页面末尾会有好处，特别是如果您尝试加载的文件速度很慢而阻塞页面。

Answer 4

放置JS的位置还取决于您是否支持非JS用户。

如果您正在构建遵循渐进增强的想法，那么页面按钮应该在没有JS的情况下以令人满意的方式运行。 JS只会覆盖非JS功能。我认为这通常是将所有JS放在页面底部的想法的实际要求。

如果页面在没有JS的情况下不起作用（或JS功能的好处很重要），我会在标题中添加必要的JS。