Based on t
The reason behind this is as the Head gets loaded before the body. Any dynamic javascript code that gets executed in the body on load will execute correctly.
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.
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.
Traditionally pages 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.
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.
Nowadays it'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
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 need something while the body is loading, or want to expedite some ajax, then it would be appropriate to put it in the head.
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.
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.
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.
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 Pratt pointed out). Today, that's no longer the case, though :
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 defer to 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 that defer doesn'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 a window.onload even, though!
加载中...
