0

Google Pagespeed Messeger の "Parsing Javascript later" を回避するために、このスクリプトをコピーしました。 

<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 にもう 1 つの 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;

スクリプト ファイルに必要なロード順序がある場合 (たとえば、カラーボックスは 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 に答える