Why some Javascript code needs to be written in different tags and not embedded within the same

Question

When I was using the modernizr file, I came across this problem where in I need to source a file and call the script.

<script src="js/modernizr-min.js"></script>
<script>
if (!Modernizr.input.placeholder){
      $('input[placeholder], textarea[placeholder]').placeholder();
}
</script>  

Why is that the script does not work when embedded within the same script tag. I have across this situation many time, but failed to understand what causes this problem. Is that the scripts have to be written in two different script tags to make it work or else what fails it.

Answer 1

Because that's how the script HTML element is defined. A script tag may either be an external script, which is refered to by the src attribute, or in internal script defined inside the contents of the script tag. To quote the script tag's definition:

The script may be defined within the contents of the SCRIPT element or in an external file. If the src attribute is not set, user agents must interpret the contents of the element as the script. If the src has a URI value, user agents must ignore the element's contents and retrieve the script via the URI.

Other than that, there is no technical reason why you would need to split up such an inline script into two or more parts.