异步动态加载script

首先是应用场景:因为项目需要,通过HTTP请求加载另一个项目的js文件并调用该js文件的方法;
实现思路:首先用document创建script并设置各个属性,使用Ajax获取该文件的地址并赋值,调用改js方法;
实现问题:必须要先去获取js文件才能调用改js的方法,由于是异步加载,所以无法保证是否在加载完之后调用该文件中的方法;
解决思路:创建script标签并在该创建函数里加入回调函数,在回调函数里判断该文件是否加载成功,成功则在回调函数里调用该文件中的方法
附上代码:

//动态插入script标签 
function createScript(url, callback){ 
    var oScript = document.createElement('script'); 
    oScript.type = 'text/javascript'; 
    //oScript.async = true; 
    oScript.src = url; 
    /* 
    ** script标签的onload和onreadystatechange事件 
    ** IE6/7/8支持onreadystatechange事件 
    ** IE9/10支持onreadystatechange和onload事件 
    ** Firefox/Chrome/Opera支持onload事件 
    */ 

    // 判断IE8及以下浏览器 
    var isIE = !-[1,]; 
    if(isIE){ 
        oScript.onreadystatechange = function(){ 
            if(this.readyState == 'loaded' || this.readyState == 'complete'){ 
                callback(); 
            } 
        } 
    } else { 
    // IE9及以上浏览器,Firefox,Chrome,Opera 
    oScript.onload = function(){ 
        callback(); 
        } 
    } 
    document.body.appendChild(oScript); 
} 

方法大家应该都能看懂,根据浏览器不同调用不同的插入方法;
调用该方法:

createScript(data.ssoJsUrl, function(){ 

                });

完毕;

阅读更多
文章标签: js jquery 前端
个人分类: 前端jQuery和js
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

不良信息举报

异步动态加载script

最多只允许输入30个字

加入CSDN,享受更精准的内容推荐,与500万程序员共同成长!
关闭
关闭