There are so many different ways to include JavaScript in a html page. I know about the following options:
- inline code or loaded from external URI
- included in <head> or <body> tag [1,2]
- having none,
deferorasyncattribute (only external scripts) - included in static source or added dynamically by other scripts (at different parse states, with different methods)
Not counting browserscripts from the harddisk, javascript:URIs and onEvent-attributes [3], there are already 16 alternatives to get JS executed and I’m sure I forgot something.
I’m not so concerned with fast (parallel) loading, I’m more curious about the execution order (which may depend on loading order and document order). Is there a good (cross-browser) reference that covers really all cases? E.g. http://www.websiteoptimization.com/speed/tweak/defer/ only deals with 6 of them, and tests mostly old browsers.
As I fear there’s not, here is my specific question: I’ve got some (external) head scripts for initialisation and script loading. Then I’ve got two static, inline scripts in the end of the body. The first one lets the script loader dynamically append another script element (referencing external js) to the body. The second of the static, inline scripts wants to use js from the added, external script. Can it rely on the other having been executed (and why :-)?