javascript - 如何通过 script 元素访问 javascript 加载的外部脚本

Question

我想创建自己的资源加载器。为了加载外部脚本，我使用了以下 JavaScript

function loadScript(src, callback) {
  var script = document.createElement("script");
  script.onload = function() {
    document.head.appendChild(script);
    callback();
  };
  script.src = src;
}

但我认为这不是最优雅的解决方案。此代码片段会使我的 HTML 代码变得丑陋，因为它将代码附加到我的所有依赖项的头部。

所以我的问题:是否可以在不使用以下行的情况下访问我的外部加载代码

document.head.appendChild(script);

我可以用纯js执行我的脚本吗

script.execute();

或者更好的是，有没有办法访问存储在我的外部 js 文件中的数据？例如变量“bar”？

var foo = script.get("bar")

我什至可以执行外部文件的函数吗？

script.function(params)

很高兴听到您的想法和经验!
达斯月亮

编辑:我忘记排除ajax。我知道我可以通过 ajax 加载代码并通过 eval() 执行它，但是如果您在本地测试代码，这不是一个好主意，因为您需要一个服务器(如 XAMPP Apache)将 ajax 请求发送到本地文件。

Answer 1

您可以尝试如下所示的操作。

内部脚本:

function appendScript(src) {
    var script = document.createElement(‘script’);
    script.src = src;
    document.head.appendChild(script);
}

外部脚本:

function loadedScript() {
   // run something
}

loadedScript()

一旦文件加载，外部代码就会运行loadedScript()。