js-动态添加脚本

简述使用动态脚本加载JS，并且在浏览器中的兼容处理：

Firefox，Opera，Chrome，Safari3以上版本会在<script>元素接收完成是触发一个load事件，因此可以通过侦听此事件来获得脚本加载完成时的状态：

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

script.type="text/javascript";

// Firefox，Opera，Chrome，Safari 3+

script.onload=function(){

alert("Script loaded");

}

script.src="file1.js";

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

IE支持另一种实现方式，它会触发一个readystatechange事件；

下面的函数封装了标准及IE特有的实现方法：

function loadScript(url，callback){

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

    script.type="text/javascript";

    if(script.readyState){    //    IE

        script.onreadystatechange = function(){

            if(script.readyState == "loaded"  ||  script.readyState == "complete"){

                script.onreadystatechange = null;        // 只要loaded和complete任何一个触发，则删除事件处理器（以确保事件不会处理两次）

                callback();

            }

        }

    }else{    //其他浏览器

        script.onload = function(){

            callback();

        }

    }

    script.src = url;

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

}

loadScript()函数用法如下：

loadScript("file1.js",function(){

    alert("File is loaded");

});

动态脚本加载凭借着它在跨浏览器兼容性和易用的优势，成为最通用的 无阻塞加载解决方案！

一旦页面初始化所需的代码完成下载，你可以继续自由的使用loadScript()去加载页面其他的功能所需的脚本；