Before HTML4 scripts were only allowed in the head. From HTML4 onwards, they were allowed in the body as well. After further investigations took place, the benefits of doing so were discovered. The trouble is that ancient web browsers (much older than IE6) weren't able to have scripts in the body.
It takes a while for old web browsers to die (or die out enough), so it has only been within the past 4 years or so that it has been a viable technique to use widely.
So now you have a choice when scripts need to touch the body content.
Head scripts cannot directly touch the body, because at that moment, the body does not yet exist. So, head scripts have to employ various type of trickery in order to touch the body.
- They may wait for the onload event, by which time people are sick and tired of waiting for images to finish loading before the script can begin
- They may wait for the DOM to finish loading, which require difficult to remember cross-browser code, and is also only supported in some web browsers
- Or they may use a timed interval to continue polling the page until the part they want to touch becomes available.
Another problem with head scripts is that they completely block the page loading process. Whenever a head script is encounted, nothing on the page is allowed to loaded until the head script has loaded, and fully finishes running its script.
Body scripts have some advantages over that.
- They automatically have access to everything that's above them, so there's no need to wait an onload event.
- They can be run immediately, so they get to be executed even before the DOM has finished loading.
- Polling techniques by using timed intervals aren't required, but may still have a useful place from the head.