0

为了避免 Google Pagespeed Messeger“稍后解析 Javascript”，我复制了这个脚本。 

<script type="text/javascript">
 function downloadJSAtOnload() {
    var element = document.createElement("script");
    element.src = "http://example.com/templates/name/javascript/jquery.js";
    document.body.appendChild(element);
    var element1 = document.createElement("script");
    element1.src = "http://example.com/templates/name/javascript/jquery.colorbox-min.js";
    document.body.appendChild(element1);
 }
 if (window.addEventListener)
    window.addEventListener("load", downloadJSAtOnload, false);
 else if (window.attachEvent)
    window.attachEvent("onload", downloadJSAtOnload);
 else 
    window.onload = downloadJSAtOnload;
</script>

我怎么能用循环来解决它，因为我需要在 DOM 中再插入一个 javascript 文件。

问候罗恩

4

1 回答 1

1

您可以制作这样的函数，它采用任意数量的脚本文件名：

function loadScriptFiles(/* pass any number of .js filenames here as arguments */) {
    var element;
    var head = document.getElementsByTagName("head")[0];
    for (var i = 0; i < arguments.length; i++) {
        element = document.createElement("script");
        element.type = "text/javascript";
        element.src = arguments[i];
        head.appendChild(element);
    }
}

function downloadJSAtOnload() {
    loadScriptFiles(
        "http://example.com/templates/name/javascript/jquery.js",
        "http://example.com/templates/name/javascript/jquery.colorbox-min.js",
        "http://example.com/templates/name/javascript/myJS.js"
    );
}

 if (window.addEventListener)
    window.addEventListener("load", downloadJSAtOnload, false);
 else if (window.attachEvent)
    window.attachEvent("onload", downloadJSAtOnload);
 else 
    window.onload = downloadJSAtOnload;

如果您的脚本文件具有所需的加载顺序（例如，我假设 colorbox 必须在 jQuery 之后加载），您将不得不做一些比这更复杂的事情，因为这会异步加载它们，因此它们没有保证的加载顺序。一旦您需要特定的加载顺序，最好获取其他人为解决此问题而编写的代码，例如RequireJS或LABjs或Google.load()。

注意：我还将脚本文件附加到<head>标签中，这是放置它们的更好位置。

使用 LABjs 时，你没有把它.wait()放在正确的位置。 .wait()告诉加载器等到所有 PRIOR 脚本都加载完毕后再加载下一个。我认为你需要这样的：

$LAB 
   .script("templates/name/javascript/jquery.js").wait()
   .script("templates/name/javascript/jquery.colorbox-min.js");
于 2012-04-04T18:53:40.710 回答