JavaScript是否必须位于head标签中？

我相信javascript可以在任何地方（几乎），但我几乎总是看到它在<head></head>之间。我正在使用jquery，并想知道它是否必须出于某种原因存在于head标签中，或者如果我将它移动，将会破坏某些东西。谢谢。JavaScript是否必须位于head标签中？

编辑：为什么它几乎总是在头标签？

来源

2009-07-31 johnny

就像一个笔记一样，如果您使用FireBug中的`

当浏览器读取脚本标记后，所有事情都会停止，直到它处理完毕。因此，如果您尽可能将脚本标记向下移动，则页面会更快地渲染 - 理想情况下，就在最后一个标记之前。显然总载入时间将是相同的。

你将不得不确保你实际上没有调用任何jQuery函数，直到包含jQuery。

来源

2009-07-31 15:46:25 Draemon

基本上，浏览器停止呈现页面，直到.js文件被完全下载并处理。由于它们在HTML到达时逐渐渲染页面，因此引用后面的.js文件，则用户体验会更好。

所以诀窍是在head中只包含绝对重要的脚本，并在页面尾部加载剩余的脚本。

来源

2009-07-31 15:46:37

它可以去head或body标签。请记住，只要读取它就会执行，而不一定在文档完成加载时执行。看看here。

来源

2009-07-31 15:46:42 rmarimon

因为您不希望JavaScript与HTML混合 - 具有行为的内容。最好你想在一个单独的文件。
让JS在其他地方有优点和缺点 - 例如它会在不同的时间执行，并且您可以从位于正文中的javascript写入文档。

来源

2009-07-31 15:46:46 EFraim

不，它可以在任何地方。事实上，把它放在文档的底部是个好主意。有关解释原因，请参阅http://developer.yahoo.com/performance/rules.html#js_bottom。

来源

2009-07-31 15:46:56 Nate

实际上，出于性能原因，您几乎总是希望将脚本标签放在页面的底部。为什么？您希望首先加载页面结构和CSS，以便用户立即看到页面。然后你想要所有你的行为驱动代码加载最后。 YSlow是一个很好的Firefox扩展，它会向你显示性能等级。它为你评分的项目之一是你是否在底部而不是顶部有javascript。

来源

2009-07-31 15:47:07

第SCRIPT不仅分类为head.misc element，而且还分为special element，因此在允许的任何地方允许inline elements。刚刚结束标记，使得JavaScript是加载之前整个文档进行解析之前

<p>foo <script>document.write("bar")</script></p>

事实上，some recommend to put SCRIPT elements at the end of the BODY：所以，你可以把一个SCRIPT无论内联元素是允许的。这是为了防止JavaScript阻止并行下载。

来源

2009-07-31 15:49:08 Gumbo

根据用户的浏览器以及您将Javascript放置在页面中的哪个位置，只需注意可能对延迟造成的不良影响 - 请参阅Steve Souders必须说的所有内容，包括他的视频斯坦福大学的讲座，他的工作成果留下了，例如here（尽可能将脚本放在页面的底部等等）。

来源

2009-07-31 15:49:37

在某些情况下，如果脚本位于错误位置，脚本可能无法正常工作。某些JavaScript需要在特定的HTML元素之后执行，其他JavaScript需要恰好在您希望脚本输出显示的位置，其他JavaScript应位于文档的头部。这实际上取决于如何编写代码。如果你不知道，你应该window.load或domready中执行代码：http://www.javascriptkit.com/dhtmltutors/domready.shtml

来源

2009-07-31 15:49:54 AyexeM

这就是为什么JavaScript是在这样一个烂摊子，为什么旧的StackOverflow职位是开发者最可怕的噩梦。现在JS变化如此之快，每周都会有一个新的框架出现，每个人都被它的倡导者称为蜜蜂跪下。

Gumbo说得对，脚本标记可以在内联元素的任何位置引用，但加载外部JS文件或在代码中包含JS代码的选择是针对每种情况分别作出的决定。是的，浏览器会在分析时停止加载JS，因此您需要考虑这将如何影响页面加载速度和功能。目前或一年前，2015年中（考虑到popualar的答案是在2009年7月，大多数开发者不会阅读这些内容，因为他们看到答案1并继续前进!!!）是给定移动页面加载速度的优先级要求对移动/蜂窝电话桅杆提出两个请求限制，在3G下给你一个28K（2×14kb（是））有效载荷，你需要考虑（以Google的名字命名）28k的“油漆到屏幕”这应该为用户提供足够的页面内容/交互性，以确保他们在正确的页面或正确的轨道上，在那28k。所以一个JQuery的缩小版本目前是87.6lkb，只是不会削减芥末！

这就是为什么大多数移动页面加载目前在加载任何东西前几秒钟，这就是4G！不要这样做。在您的JQuery文件加载之前，页面速度为王并且用户点击后退按钮。在3G +下，一个28k的有效载荷将在< 1秒内加载，所以没有理由说明你的网页在那段时间内没有开始加载。当你下次打你的手机上的链接时，看着小酒吧坐下，等待它通过下一页上的所有标签！

因此，构建你的页面不要放在SO所说的7年前的帖子上（它没有错仅仅是过时的），但是每一段代码都是必需的，并且确保用户可以使用他最重要的方面在尝试加载6个JS框架以实现智能平行滚动和广泛的数据绑定为您的联系页面之前的页面。

顺便说一下，Google要求您将JS推到最低处，因为它们提供了Google分析代码，而且这需要成为最后一次加载。

想想你的代码！

来源

2016-11-10 21:31:07 Jools

JavaScript是否必须位于head标签中？

相关问题