1

我的 javascript 文件有一个非常令人沮丧的问题。我有一个包含 page_data、实用程序、模块等命名空间的全局命名空间。

我的目录如下所示： /utilities/single_utility.js /modules/module.js 等 tec

无论如何，我在模块之前加载实用程序（使用实用程序）但不断遇到问题。

我的加载程序脚本看起来像这样（它包含在 SEAF 中）：

    for (var index in file_list) {

    var url = file_list[index];
    var new_script = document.createElement('script');

    new_script.setAttribute("type", "text/javascript");
    new_script.setAttribute("src", url);

    element.appendChild(new_script);
}

Project 是我的全局命名空间，它包含所有这些其他命名空间。但是，当我尝试使用 Project.utilities.session.exist() 等在我的一个模块中引用实用程序时，有时会引发无法找到 Project 的错误？

我该如何解决这个问题以确保我的文件正确加载或者我做错了什么？

4

3 回答 3

3

使用async = false应该保护您的加载顺序。

这是我用来加载和维护秩序的快速片段。

var loadScript = function( url ) {
    if (url) {
        var doc = document,
        t = doc.createElement("script"),
        s = doc.getElementsByTagName("script")[0];
        t.type = "text/javascript";
        // Keep script order!
        t.async = false;
        t.src = url;
        s.parentNode.insertBefore(t, s);
    }
};

来自MDN和Microsoft的一些支持此逻辑（以及关于浏览器支持）的参考资料

于 2012-08-18T03:21:40.410 回答
0

当您将脚本标签添加到页面时，浏览器必须出去下载这些脚本。无法保证它们会按照您创建它们的顺序下载和执行。

您将需要在加载new_script时添加一个事件侦听器，或者onload或onreadystatechange，具体取决于浏览器。但我确实建议使用脚本加载库（例如RequireJS）来为您处理所有令人讨厌的细节。

顺便说一句，为什么不直接将所有脚本标签添加到您的页面？在这种情况下，它们会按顺序加载。

于 2012-08-18T03:13:25.980 回答
0

最好使用脚本加载器解决此问题。

正如马特所说，如果您还想处理脚本依赖项，RequireJS是一个不错的选择。

仅用于脚本加载，您可以查看LAB.js，它非常小且简单：

for (var index in file_list) {
    $LAB.script(file_list[index]);
}

如果脚本具有依赖关系并且必须按顺序加载，您可以使用.wait(), 来保留脚本返回的链对象。您可以重新编写循环以保留链：

var chain;
for (var index in file_list) {
    if (!chain) { 
         chain = $LAB.script(file_list[index]).wait(); 
    } else {
         chain.script(file_list[index]).wait();
    }
}

或者干脆忘记file_list数组并直接使用 $LAB ：

$LAB.script('file1.js').wait()
    .script('file2.js').wait()
    /* ... */
于 2012-08-18T03:50:24.037 回答