码迷,mamicode.com
首页 > 编程语言 > 详细

javascript 异步加载

时间:2020-03-22 10:44:58      阅读:67      评论:0      收藏:0      [点我收藏+]

标签:set   ini   hang   div   class   动态加载   doc   on()   common   

javascript 异步加载

背景:公司使用新的统计埋点,由于弹层出现地方较多,新埋点方法未能及时压入common.js 所以需要自己引入阿里云上的埋点文件

技术图片

问题1:在代码里输入

<script src="xxxx/xx.js"></script>`

后台直出到页面上==script==并未去请求js,导致代码报错

问题2:动态==异步==添加到dom中

由于是 异步的 导致 js 还没加载完 下面的埋点调用就开始执行了 js报onloginit undefind

解决方法

;
(function() {
    /**
     * 动态加载js文件
     * @param  {string}   url      js文件的url地址
     * @param  {Function} callback 加载完成后的回调函数
     */
    var _getScript = function(url, callback) {
        var head = document.getElementsByTagName(‘head‘)[0],
            js = document.createElement(‘script‘);

        js.setAttribute(‘type‘, ‘text/javascript‘); 
        js.setAttribute(‘src‘, url); 

        head.appendChild(js);

        //执行回调
        var callbackFn = function(){
                if(typeof callback === ‘function‘){
                    callback();
                }
            };

        if (document.all) { //IE
            js.onreadystatechange = function() {
                if (js.readyState == ‘loaded‘ || js.readyState == ‘complete‘) {
                    callbackFn();
                }
            }
        } else {
            js.onload = function() {
                callbackFn();
            }
        }
    }

    //如果使用的是zepto,就添加扩展函数
    if(Zepto){
        $.getScript = _getScript;
    }
    
})();

在js加载完触发回调 里执行


js.onload = function callback() {}

javascript 异步加载

标签:set   ini   hang   div   class   动态加载   doc   on()   common   

原文地址:https://www.cnblogs.com/homehtml/p/12544186.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!