为什么要把 JavaScript 放在脑子里
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8249013/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Why put JavaScript in head
提问by Danny
If it is perfectly acceptable to put JavaScript right before </body>what is a good reason to keep it in the <head>?
如果将 JavaScript 放在前面是完全可以接受的，</body>那么将它保留在<head>.
Based on the question JavaScript in <head> or just before </body>?many answers state that the page will load faster if you put it right before the </body>tag.
基于<head> 中还是 </body> 之前的 JavaScript问题？许多答案表明，如果将页面放在</body>标签之前，页面加载速度会更快。
However I don't see any sound arguments on why it should be kept in the <head>. I'm asking because I am not a very strong JavaScript developer and from everything I've read and seen, the standard is to keep most JavaScript code and external references in the the <head>.
但是，我没有看到任何关于为什么应该将其保留在<head>. 我这么问是因为我不是一个非常强大的 JavaScript 开发人员，而且从我所阅读和看到的所有内容来看，标准是将大多数 JavaScript 代码和外部引用保留在<head>.
采纳答案by regality
Anything in the head must be completed before the body is loaded, so it is generally a bad idea to put javascript in there. If you needsomething while the body is loading, or want to expedite some ajax, then it would be appropriate to put it in the head.
head 中的任何内容都必须在加载 body 之前完成，因此将 javascript 放入其中通常是一个坏主意。如果你在加载 body 时需要一些东西，或者想要加速一些 ajax，那么把它放在 head 中是合适的。
回答by Chris
The reason behind this is as the Headgets loaded before the body. Any dynamic javascript code that gets executed in the body on load will execute correctly.
这背后的原因是因为Head在身体之前加载。加载时在正文中执行的任何动态 javascript 代码都将正确执行。
If you have javascript that is just before the </body>tag then any javascript calls made to functions by your page as it loads will error.
如果您的 javascript 就在</body>标记之前，那么您的页面在加载时对函数进行的任何 javascript 调用都会出错。
So yes putting javascript before the </body>tag will load faster. But only if your javascript will be executed after page load via clicks for example.
所以是的，将 javascript 放在</body>标签之前会加载得更快。但前提是您的 javascript 将在页面加载后通过点击执行。
回答by BumbleShrimp
If you need the javascript to accomplish something on the page, and you don't want the end user to see the content until that's accomplished, then you should include it in the head. It really depends on each individual case.
如果您需要 javascript 来完成页面上的某些事情，并且您不希望最终用户在完成之前看到内容，那么您应该将其包含在头部。这真的取决于每个个案。
Most of the time, putting it at the bottom really IS better for optimizing page download, as the user will get to see all the content on the page before the JS even starts downloading.
大多数时候，把它放在底部确实更适合优化页面下载，因为用户甚至可以在 JS 开始下载之前看到页面上的所有内容。
回答by Chris Pratt
The onlyreason to put JS in the head is for scripts that modify how the browser actually renders the page. For example, Modernizr.js is loaded in the head so that it can do things like add support for HTML5 elements and manipulate classes on the <html>tag before the page begins to render.
将 JS 放在首位的唯一原因是用于修改浏览器实际呈现页面方式的脚本。例如，Modernizr.js 加载在头部，以便它可以<html>在页面开始呈现之前执行诸如添加对 HTML5 元素的支持和操作标签上的类等操作。
Otherwise, your JS should be going in at the bottom of the page.
否则，您的 JS 应该进入页面底部。
回答by Chris Pratt
In the past, the only reason to put JS in the head was for scripts that modify how the browser actually renders the page (as Chris Prattpointed out). Today, that's no longer the case, though :
过去，将 JS 放在首位的唯一原因是用于修改浏览器实际呈现页面方式的脚本（正如Chris Pratt指出的那样）。但今天，情况不再如此：
If you still care a lot about support and performance in IE<10, it remains the best approach to make your script tags the last tags of your HTML body. That way, you're certain that the rest of the DOM has been loaded and you won't block and rendering.
If you don't care too much anymore about IE<10, you might want to put your scripts in the head of your document and use
deferto ensure they only run after your DOM has been loaded (<script type="text/javascript" src="path/to/script1.js" defer></script>). The beauty of this approach, is thatdeferdoesn't block loading the rest of the DOM. If you still want your code to work in IE<10, don't forget to wrap your code in awindow.onloadeven, though!
如果您仍然非常关心 IE<10 中的支持和性能，那么将脚本标记作为 HTML 正文的最后标记仍然是最佳方法。这样，您可以确定 DOM 的其余部分已加载，并且不会阻塞和呈现。
如果您不再关心 IE<10，您可能希望将您的脚本放在文档的头部并用于
defer确保它们仅在您的 DOM 加载后运行 (<script type="text/javascript" src="path/to/script1.js" defer></script>)。这种方法的美妙之处在于defer不会阻止加载 DOM 的其余部分。如果您仍然希望您的代码在 IE<10 中工作，请不要忘记将您的代码包裹在一个window.onload偶数中！
回答by Timothy Trousdale
The head Tag loads before the Body, so Javascript that is required to load the website properly should be put there, but if it isn't required most people feel it's better to put it at the end of your body tag.
head 标签在 Body 之前加载，因此正确加载网站所需的 Javascript 应该放在那里，但如果不需要，大多数人认为最好将它放在 body 标签的末尾。
回答by Daniel Land
Traditionallypages didn't used to validate (be it XHTML Strict validation, or WAI-AAA compliance, I can't remember exactly what failed, but something failed when scripts were in the body). This would usually go alongside the recommendation of putting all scripts into external files, and linking to them with a script src="" tag.
传统上页面不用于验证（无论是 XHTML 严格验证还是 WAI-AAA 合规性，我不记得究竟是什么失败了，但是当脚本在正文中时，某些事情失败了）。这通常与将所有脚本放入外部文件并使用脚本 src="" 标签链接到它们的建议相一致。
Logic:Perhaps it was recommended by the W3C as a way of preserving the body for the most semantic markup. I think also, historically, this logic was important in days when internet was generally a lot slower - some browsers were configured to reject scripts and styles and images based on internet connectivity diagnostics & settings, and having a script in the head is a way of telling browsers "it's OK to reject this script if connectivity issues warrant it" where as scripts in the body are semantically considered to be more integral to the content. This is such a nuance though, and based on probably out-dated W3C recommendations, so I'd be hard-pressed to find a browser that actually operates in this way these days.
逻辑：也许它是 W3C 推荐的，作为一种保留正文的方式，以获取最语义化的标记。我还认为，从历史上看，这种逻辑在互联网速度普遍较慢的日子里很重要——一些浏览器被配置为根据互联网连接诊断和设置拒绝脚本、样式和图像，并且在头脑中使用脚本是一种方式告诉浏览器“如果连接问题需要，拒绝这个脚本是可以的”，因为正文中的脚本在语义上被认为是内容更完整的一部分。不过，这是一个如此细微的差别，并且基于可能已经过时的 W3C 建议，因此我很难找到如今以这种方式实际运行的浏览器。
Nowadaysit's only to affect how the page behaves while rendering.
如今，它只会影响页面在呈现时的行为方式。
Caution:This shouldn't apply to scripts that don't affect above-the-fold content - better to defer their loading by putting them just before the closing body tag so that users can see the above-the-fold content quicker (without having to wait for render-blocking scripts to load). This is a key pagespeed recommendation from Google and Yahoo
注意：这不适用于不影响首屏内容的脚本 - 最好通过将它们放在结束正文标签之前来推迟加载，以便用户可以更快地看到首屏内容（没有必须等待渲染阻止脚本加载）。这是谷歌和雅虎的关键页面速度推荐
回答by Jan Wiemers
Thats a Question like "windows" or "mac" I think, If you put all your JS Source in the Head Section of the Website your are quit strong to the W3C. The Other Case is everthing in the Head must be loaded befor the body Element. And befor the DOM is correctly loaded. JavaScript Frameworks like jQuery have Functions like $(document).ready() to check the complete DOM is loaded. So you could do all your JS in the Head Tag. My Preference is to load all JS at the End of the Body but this decision goes to each Developer at its own :)
这是一个像“windows”或“mac”这样的问题，我认为，如果你把你所有的 JS 源代码放在网站的 Head 部分，你就对 W3C 很感兴趣。其他情况是 Head 中的所有内容都必须在 body 元素之前加载。并且在正确加载 DOM 之前。像 jQuery 这样的 JavaScript 框架具有像 $(document).ready() 这样的函数来检查完整的 DOM 是否已加载。所以你可以在 Head 标签中完成所有的 JS。我的偏好是在正文的末尾加载所有 JS，但这个决定由每个开发人员自行决定:)
