There are only two places that are even worth considering when it comes to attaching JavaScript to your page in the least obtrusive and most efficient way possible. They are to either place your script tag immediately before the </head> tag or immediately before the </body> tag of your page. In both cases you should be linking to an external script and ideally that script tag should be the only thing in the HTML that contains any JavaScript reference at all.
So how do we decide which of those two places to put the script tag? There are a few things we need to consider and the one that has the biggest impact is whether our web page is using HTML or is using XHTML. Note that which of these two you are using depends on the MIME type of the page with text/html being the MIME type for HTML and application/xml-xhtml being the MIME type for XHTML. Using an XHTML doctype with an HTML MIME type still means your page is HTML and so you should consider it as HTML for the following discussion.
With the HTML DOM the elements in the DOM are available as soon as they are added to the web page and so as long as the element in the page you are referencing is before the call to the script you are trying to reference it from then the DOM reference from your JavaScript will work. This means that with your script tag immediately before the </body> tag that your JavaScript will be able to access all the elements in the page immediately without needing to test if the page or the DOM has finished loading.It therefore doesn't matter whether your scripts placed at that point in the HTML page test for whether the page or the DOM are loaded before running since everything you want to access has already loaded whether those events have triggered or not.
The XHTML DOM works differently. Nothing in the XHTML DOM can be accessed until the DOM finishes loading. You therefore need to test for the DOM having loaded as the minimum requirement for being able to access anything in the page regardless of where you place the script tag.
Older browsers do not provide a way to test specifically if the DOM has loaded and so for those browsers you need to wait until the entire page has finished loading or alternatively set up a loop to test for when the appropriate element becomes accessible before accessing it if you place your script in the head of your page or are using XHTML.See faster DOM access for one way to set this up.
Another consideration for script placement is the way that web browsers load web pages. With all file types except for scripts old browsers could load files two at a time. For newer browsers the number of files they can load simultaneously has been increased to eight provided that none of them is a script. It is only in the very latest browsers where there is even a slight possibility that a script referenced from within your web page will be able to load at the same time as any other files referenced from the page.The script will wait until all the files currently loading finish lading and will force all the other files that have yet to start loading to wait until the script finishes loading.
What this means is that if you place your script tag closer to the end of your page then you allow all the other files your page needs to load first and so the page will appear to load much faster. This provides another good reason for placing your script at the end of the body rather than in the head.
There is one way around the one script at a time limit for all browsers and that is because the limit only applies to scripts loaded directly from the HTML. If you dynamically add the script tags into the web page using JavaScript then those scripts added that way will start loading as soon as their tag has been added to the page without regard to what other files the web page may be loading at the same time. Because those additional scripts are being loaded from JavaScript rather than from HTML they are not subject to the one at a time script limit that most browsers impose on HTML. See adding JavaScript from JavaScript for a short script that will make doing this really easy.
When you add the JavaScripts to your page from JavaScript itself at the bottom of the body then it doesn't really matter whether you add them to the head or the body of the web page since in either case you know that the DOM has already loaded prior to those scripts being added to the page.
In the case of XHTML and adding scripts it also doesn't matter where you add the JavaScripts but for the opposite reason. With XHTML you have to wait for the DOM to finish loading before you can run the script that adds the other scripts into your page.
Overall when you take all of these factors into account, the way in which to get your web page to appear to load as fast as possible by not being held up by scripts is to place the JavaScript at the end of the body. The way to make your script easier to write for HTML because you can do away with the need to test if the DOM is loaded is to place the script at the end of the body.
While placing your scripts in the head of the page may look neater because it reserves the body for what will actually appear in the web page, placing the script there will slow the loading of your page (which you can only minimise by reducing that script to one which dynamically adds the script tags after the page last loaded) and where the script itself will need to be more complex so as to ensure that the code doesn't try to run before the appropriate parts of the DOM are available.