Question

我正在从文档中存在的另一个javascript文件加载一个javascript外部文件，因为它已加载，我想从加载的js文件中调用一个函数。这是加载函数：

function loadScript(url) {
    var head = window.top.document.getElementsByTagName('head')[0];
    var script = window.top.document.createElement('script');
    script.src = url;
    script.type= "text/javascript";
    head.appendChild(script);
    if(script.readyState) {  //IE
        script.onreadystatechange = function() {
            if ( script.readyState === "loaded" || script.readyState === "complete" ) {
                script.onreadystatechange = null;
                console.log("[BANDEAU] script loaded");
                testAlert();
            }
        };
    } else {  //Others
        script.onload = function() {
            console.log("[BANDEAU] script loaded");
            testAlert();
        };
    }
}

所以它工作得很好因为javascript文件已成功加载但我无法从加载的javascript文件中访问testAlert()方法，因为我在打印脚本加载后立即尝试上面的代码。当我尝试在typeOf上使用window[testAlert]获取函数的类型时，我得到一个未定义的。但是当我尝试在开发人员控制台中执行testAlert()方法时，它可以完美地运行。有谁看到我做错了什么？

调用者javascript文件和加载的javascript文件之间DOM中的位置可能是原因吗？

Answer 1

您需要在更改src之前分配加载处理程序

function loadScript(url) {
  var head = document.getElementsByTagName('head')[0]; // window.top in frames/iFrames
  var script = document.createElement('script');
  script.type = "text/javascript";

  if (script.readyState) { //IE
    script.onreadystatechange = function() {
      if (script.readyState === "loaded" || script.readyState === "complete") {
        script.onreadystatechange = null;
        console.log("[BANDEAU] script loaded");
        testAlert(); // window.top.testAlert() if needed
      }
    };
  }
  else {
    script.onload = function() {
      console.log("[BANDEAU] script loaded");
      testAlert(); // window.top.testAlert() if needed
    };
  }
  script.src = url;
  head.appendChild(script);
}

Answer 2

除了mplungjan所说的内容之外，我非常确定您必须对加载的脚本执行eval（）才能拥有调用testAlert（）的合法地址。

另外，请查看this link以获取更多信息。

无法从动态加载的javascript文件中调用函数

2 个答案: