动态加载JavaScript文件

最新推荐文章于 2021-04-19 23:39:08 发布

原创最新推荐文章于 2021-04-19 23:39:08 发布 · 221 阅读

0 ·

CC 4.0 BY-SA版权

JavaScript 专栏收录该内容

73 篇文章

订阅专栏

博客展示了一个简单的动态加载JavaScript的demo，给出了testA.js代码和main.html中的脚本，运行结果显示加载JavaScript文件是异步的，若放开特定代码行会报错，提示testA未定义。

写一个简单的动态加载JavaScript demo：

testA.js 代码如下：

var testA = {};

(function (self) {
    self.pubFunc1 = function () {
        console.log("testA pubFunc1");
    }
})(testA);

main.html中的脚本如下：

function loadScripts(url) {
    var script = document.createElement("script");
    script.type = "text/javascript";
    script.src = url;
    document.body.appendChild(script);
    script.onload = function () {
        console.log("testA load done");
    }
}

loadScripts("testloadJS/testA.js");

console.log("use testA");
//testA.pubFunc1();

运行结果如下：

use testA

testA load done

从运行结果我们看出加载JavaScript文件是异步的。

//testA.pubFunc1(); 把这一行放开，会出现报错：testA 没有定义。