关于动态加载JavaScript文件的几种方式

以下是遇到的几种动态加载JavaScript文件的方式，持续更新中。。。

一、使用document.write/writeln(）方式

该种方式可以实现js文件的动态加载，原理就是在重写文档流，这种方式会导致整个页面重绘。

实现方式:

document.writeln("<script src=\"http://lib.sinaapp.com/js/jquery/1.6/jquery.min.js\"></script>");

需要注意的是特殊字符的转义。

二、使用jQuery

使用getScript(url,callback)方法实现动态加载js文件

$.getScript('test.js',function(){
    alert('done');
});

三、使用原生js方法

原理：动态创建script标签，并指定script的src属性

function loadJs(url,callback){
        var script=document.createElement('script');

        script.type="text/javascript";
        if(typeof(callback)!="undefined"){
            if(script.readyState){
                script.onreadystatechange=function(){

                    if(script.readyState == "loaded" || script.readyState == "complete"){
                        script.onreadystatechange=null;
                        callback();
                    }
                }

            }else{
                script.onload=function(){
                    callback();
                }
            }
        }
        script.src=url;
        document.body.appendChild(script);
    }

    loadJs("test.js",function(){
        alert('done');
    });

还可以使用同样的原理动态加载css文件，只不过插入的的父节点是head标签。