如何中止脚本加载

Question

是否可以停止加载以下方式加载的 JS 文件，是否有任何事件处理程序？

function makeScript(url){    
    script = document.createElement("script");
    script.src = url;
    //when this line is executed the script will be loaded by the browser
    //is there an event where the below script loading can be stopped based                                                                   
    //on some condition                        
    document.head.appendChild(script); 
}

我不想通过 ajax 调用加载脚本，因为 js 文件没有出现在 Chrome 调试器工具的源选项卡下。有可能的解决方案，例如使用//# sourceURL=dynamicScript.js，但我必须将此行放在所有 js 文件中。我不想编辑所有的 js 文件。如果更改本地化到 1 个地方，那很好。

Answer 1

在你的cmets之后

假设有 2 个链接，点击每个链接使用 makeScript() 加载 js 文件。如果用户点击第一个链接并快速点击第二个链接，我想中止加载第一个链接的 js 文件。如果 js 文件的加载没有停止，那么脚本中可能存在 TypeErrors，因为当单击另一个链接时，第一个链接的变量将被删除，该变量将被加载脚本使用。

这是我的想法

您可以维护一个全局变量来保存要加载的脚本。根据这个变量，你可以执行document.head.appendChild(script);这行代码。

示例代码

var scriptFilesConfig; //make this global scope variable

点击每个链接后，将此网址分配给全局变量。

假设您点击了第一个链接，那么变量将是

scriptFilesConfig = "firstscript.js";

好的，现在我立即点击了第二个链接，那么您必须将此 url 分配给变量。所以现在你的对象会是这样的。

scriptFilesConfig = "secondScript.js";

现在在任何给定点，只有当脚本的 url 与全局变量匹配时，您才会执行 document.head.appendChild(script);。

所以你的代码会是这样的

function makeScript(url){    
    script = document.createElement("script");
    script.src = url;
    if( url === scriptFilesConfig){  // append it only if the urls match.   
     document.head.appendChild(script); 
    }
}    

Answer 2

根据 cmets，试试这样的：

function makeScript(url)
{
    script = document.createElement("script");

    script.onload = function()
    {
        if (!this.abort)
        {
            document.head.appendChild(script);
            return;
        }
    };

    script.src = url;

    return script;
}

你可以这样使用它：

var js1 = makeScript('path/to/file.js');

js.abort = true; // will not run

所以基本上，你需要做的就是 onclick -> 运行一个函数来相应地触发上面的 JavaScript；可能会创建一个包含最后加载脚本的对象，并让“onclick”将 makeScript 返回元素分配给可以替换或删除的对象。