script标签有一个很不常用的 async 属性,这个属性最早是由FireFox先搞出来的,然后得到了 Chrome 和 Safari 的支持,但是很不幸的是IE不支持该属性。
关于async的介绍可以见这里:http://www.w3.org/TR/html5/scripting-1.html#attr-script-async
async 属性我们大致可以这样去理解:
当script的 async 属性被置为 true 时,脚本的执行序为异步的。即不按照挂载到 Dom 的序顺执行 ,相反如果是 false 则按挂载的顺序执行。
如果script标签被直接编码到html中,那黙认的async属性为 false ,如果script 是由 document.createElement("script")得到,那么 async 属性为 true
IE、Safari和Opera是完全不鸟这个属性了,如果是动态创建script标签,Opera会按script 挂到Dom的序顺依次执行,但是 IE浏览器和 Safari 此时很不给力了异步执行了。
那么这里就会产生一个问题, 我们有一个动态载入JavaScript的需求,而且是随时都有可能动态的载入一个或多个Javascript脚本,而且这个加载一定是跨域的。使用 xhr (动态载入JavaScript代码)注入的方式肯定是不能考虑了。那如何做到并序下载按序执行呢?
我们可以尝试这种办法,首先我们使用一个type="text/seed"的script标签把所有脚本下载下来,你也可以设置成任意你想设置的东西 text/someelse 当然不能写javascript了。完成所有的脚本下载后,再依序重新生成script标签,并把标签挂入到Dom树之中。
这相当于利用浏览器的cache把文件预加载进来,然后再一个个执行。但是这个方案却是一个没有理论基础的,因为我不知道浏览器会怎么利用cache。但是目前所测试的浏览器上都达到了预期的结果。