Question

我正在使用一个相当简单的系统来动态加载javascript：

include = function (url) {
  var e = document.createElement("script");
  e.src = url;
  e.type="text/javascript";
  document.getElementsByTagName("head")[0].appendChild(e);
};

假设我有一个文件test.js，其中包含以下内容：

var foo = 4;

现在，在我的原始脚本中，我想使用

include(test.js);
console.log(foo);

然而，我得到了'foo尚未定义'的错误。我猜它与包含在<head>标签的最后一个子节点的动态脚本有关。我怎样才能让它发挥作用？

Answer 1

这是因为您必须等待脚本加载。它不像你想象的那样是同步的。这可能对您有用：

include = function (url, fn) {
    var e = document.createElement("script");
    e.onload = fn;
    e.src = url;
    e.async=true;
    document.getElementsByTagName("head")[0].appendChild(e);
};

include("test.js",function(){
    console.log(foo);
});

Answer 2

这是一个问题，但浏览器下载和解析远程JS文件也需要时间 - 而且在调用console.log之前它还没有这样做。

在脚本加载之前，您需要延迟工作。

这是最简单的方法，让一个库完成繁重的工作，jQuery有一个getScript方法，允许你在脚本加载时传递一个回调来运行。

无法从动态加载的javascript中访问变量

2 个答案: