对象未定义...动态加载脚本并创建在其中定义的对象会引发错误

时间:2017-08-31 02:34:45

标签: javascript javascript-objects

我正在加载从服务器返回的一些脚本...一些脚本中定义了对象...将脚本附加到正文并尝试创建一个新对象,考虑到脚本,因此加载了对象定义页面...不是这种情况,因为这是抛出对象未找到错误...这里是代码看起来如何...

for(var i=0; i < paths; i++){
    var script = document.createElement('script');
    script.type='text/javascript';
    script.src=paths[i].src;
    document.body.appendChild(script);
}
var new_obj = new object_name(a, b, c); // object_name not found

我可以看到脚本已成功附加到元素选项卡中的正文。

我已经尝试手动加载页面正文末尾的脚本并按照这种方式工作,但不是在我动态添加文件时...请告诉我哪里出错了....

1 个答案:

答案 0 :(得分:0)

您可以将async属性设置为false(按顺序同步加载脚本)并实现onload事件以验证脚本是否已加载。下面的代码显示了实现。我可能在实现中出错了,或者可以有更好的方法来加载基于数组的脚本(循环)并检查所有加载的文件。

 <script>
       window.onload = function () { LoadFunctions();  }
       var paths = ["test.js", "test2.js"];

       function LoadFunctions() {
           for(var i=0; i < paths.length; i++){
                var script = document.createElement('script');
                script.type='text/javascript';
                script.src=paths[i];
                script.async = false;
                script.onload = function() { callFunctions(); }
                document.head.appendChild(script);
            } 
        }

        function callFunctions(){
            if (typeof test1 != "undefined") test1(); //Check for function in test.js whether loaded or not then execute it
            if (typeof test2 != "undefined") test2(); //Check for function in test2.js whether loaded or not then execute it
        } 
</script>

test.js

function test1(){
    alert("Alert from test.js");
}

test2.js

function test2(){
    alert("Alert from test2.js");
}