异步脚本加载 JS Loader

偷懒，将别人的东西直接贴过来吧，文章来自

---------------------------分割线

JS会阻塞其它页面资源的下载，通过对JS的异步加载可以解决这个问题，加快页面内容的呈现速度。获得更好的体验。

使用script标签加载 通过firebug查看各种资源加载状态，当test.js下载完毕后，图片才开始下载。

通过firebug查看各种资源加载状态，当test.js下载完毕后，图片才开始下载。

使用JSLoader异步加载JS

当使用异步加载方式加载JS时，test.js与图片同时加载，加快了页面的呈现：

JSLoader

JSLoader.load(url, [fun1], [funN]);
参数：
url 要加载的JS的地址
fun 依赖该JS执行的函数

使用示例：

JSLoader.load('test.js', function(){
    document.getElementById('test').innerHTML = test;
});

JSLoader源码：

var JSLoader = function(){

    var scripts = {};

    function getScript(url){
        var script = scripts[url];
        if (!script){
            script = {loaded:false, funs:[]};
            scripts[url] = script;
            add(script, url);
        }
        return script;
    }

    function run(script){
        var funs = script.funs,
            len = funs.length,
            i = 0;

        for (; i < len; i++){
            var fun = funs.pop();
            fun();
        }
    }

    function add(script, url){
        var scriptdom = document.createElement('script');
        scriptdom.type = 'text/javascript';
        scriptdom.loaded = false;
        scriptdom.src = url;

        scriptdom.onload = function(){
            scriptdom.loaded = true;
            run(script);
            scriptdom.onload = scriptdom.onreadystatechange = null;
        };

        //for ie
        scriptdom.onreadystatechange = function(){
            if ((scriptdom.readyState === 'loaded' ||
                    scriptdom.readyState === 'complete') && !scriptdom.loaded) {

                run(script);
                scriptdom.onload = scriptdom.onreadystatechange = null;
            }
        };

        document.getElementsByTagName('head')[0].appendChild(scriptdom);
    }

    return {
        load: function(url){
            var arg = arguments,
                len = arg.length,
                i = 1,
                script = getScript(url),
                loaded = script.loaded;

            for (; i < len; i++){
                var fun = arg[i];
                if (typeof fun === 'function'){
                    if (loaded) {
                        fun();
                    }else{
                        script.funs.push(fun);
                    }
                }
            }
        }
    };
}();