动态加载js

在前端按需加载js是优化性能的一个方向，

现在script标签加载js基本是异步的，为了减少白屏可以在页面body加载完之后再去按需加载js，script也是标签所以我们可以像img等标签一样去使用它，下面是封装的函数，利用回调可以控制js的执行顺序，

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;
                    callback();
                }
            }
        }else { //其他
            script.οnlοad=function () {
                callback();
            }
        };
        script.src=url;
        document.getElementsByTagName("head")[0].appendChild(script);
    }

　就可以快速的使用了

loadScript('http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js',function () {
        console.log($)
    })

　　但这种方法对于需要加载很多js的页面来说很不方便，可以使用现在流行的模块化按需引入。

 

转载于:https://www.cnblogs.com/yuanzhiguo/p/9067570.html