日期:2014-05-16  浏览次数:20400 次

js文件引用方式及其同步执行与异步执行

任何以appendChild(scriptNode)?的方式引入的js文件都是异步执行的?(scriptNode?需要插入document中,只创建节点和设置?src?是不会加载?js?文件的,这跟?img?的与加载不同?)???
html文件中的<script>标签中的代码或src引用的js文件中的代码是同步加载和执行的
html文件中的<script>标签中的代码使用document.write()方式引入的js文件是异步执行的
html文件中的<script>标签src属性所引用的js文件的代码内再使用document.write()方式引入的js文件是同步执行的

1、

<script>

//同步加载执行的代码

</script>

2、

<script?src="xx.js"></script>??//同步加载执行xx.js中的代码

3、

<script>

document.write('<script?src="xx.js"><\/script>');???//异步加载执行xx.js中的代码

</script>

4、

<script?src="xx.js"></script>

xx.js中有下面代码:

document.write('<script?src="11.js"><\/script>');???

document.write('<script?src="22.js"><\/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);

???

?