javascript文件同步加载与异步加载有什么不同？

js文件同步加载

须先加载的js文件的尾部，加上如下相关代码，可以达到同步加载多个js文件的效果：
var oHead = document.getElementsByTagName('body').item(0);
var oScript = document.createElement("script");
oScript.type = "text/javascript";
oScript.src = "../middleService/deptEnter/js/UI_index.js";
oHead.appendChild(oScript

HTML 4.01 的script属性

charset: 可选。指定src引入代码的字符集，大多数浏览器忽略该值。
defer: boolean, 可选。延迟脚本执行，相当于将script标签放入页面body标签的底部，js脚本会在document的DOMContentLoaded之前执行。除IE和较新版本的firefox外，其他浏览器并未支持。
language: 已废弃。大部分浏览器会忽略该值。
src: 可选。指定引入的外部代码文件，不限制后缀名。
type: 必选。指定脚本的内容类型（MIME类型）。现实中通常不指定该值也可以，浏览器会默认当作text/javascript类型来解释执行。

HTML5中的script属性：

script 标签在HTML5中除了具备HTML5新标准定义的属性以外，和HTML4.01相比移除了language属性，修改了type属性为可选的（默认text/javascript），并新增了一个属性async。

async boolean, 属性的作用，定义脚本是否异步执行，取值true或false。

如果 async 设为 true ，会忽略 defer 属性。

设置为异步执行的 js 文件被假定为不使用 document.write()  想加载中的 document 写入内容，因此不要在 异步执行的 js 文件的加载执行 过程中使用 document.write()

除了 script 标签属性外，页面引入 js 文件的方式影响其加载执行方式：

任何以appendChild(scriptNode) 的方式引入的js文件都是异步执行的 (scriptNode 需要插入document中，只创建节点和设置 src 是不会加载 js 文件的，这跟 img 的预加载不能类比 )   

html文件中的';

=====================================================

1、

2、

  //同步加载执行xx.js中的代码

3、

4、

xx.js中有下面代码：

document.write('<\/script>');   

document.write('<\/script>');   

则xx.js和11.js、22.js 都是同步加载和执行的。

如果 xx.js 以插入方式异步加载，则 11.js 和 22.js 仍然是同步加载的（异步中的同步，即，这2个文件的加载是分先后次序的）

测试：在11中 alert, 22中 document.write() ,可以看到 22中写入语句被阻塞

5、

下面这种方式，xx.js会在appendChild执行之后异步加载执行

var script = document.createElement("script");

script.setAttribute("src","xx.js");

documenrt.getElementsByTagName("head")[0].appendChild(script);

 一个加载 js 文件的 函数：

var loadJS = function(url,callback){ 
var head = document.getElementsByTagName('head'); 
if(head&&head.length){
head = head[0];
}else{
head = document.body;
}

var script = document.createElement('script');  
script.src = url;  
script.type = "text/javascript";  
head.appendChild( script);

script.onload = script.onreadystatechange = function(){
//script 标签，IE 下有 onreadystatechange 事件, w3c 标准有 onload 事件    
//这些 readyState 是针对IE8及以下的，W3C 标准因为script 标签没有这个 onreadystatechange 所以也不会有 this.readyState , 文件加载不成功 onload 不会执行，
//(!this.readyState) 是针对 W3C标准的, IE 9 也支持 W3C标准的 onload

if ((!this.readyState) || this.readyState == "complete" || this.readyState == "loaded" ){
       callback();    
}else{       
  alert("can not load the js file")； 
    } 
}//end onreadystatechange
}

对于第4点的测试（其中插入 alert 很容易看到加载时的阻塞）

tryjs.html

tryjs.js

console.log('write begin');
document.write('