关闭

异步动态加载script

标签: jsjquery前端
691人阅读 评论(0) 收藏 举报
分类:

首先是应用场景:因为项目需要,通过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(){ 

                });

完毕;

0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:1956次
    • 积分:53
    • 等级:
    • 排名:千里之外
    • 原创:3篇
    • 转载:2篇
    • 译文:0篇
    • 评论:0条
    文章存档