7

このコードは、すべてのアプリケーションを初期化するために使用するスクリプトに含まれています。すべてのアプリケーションが必要とする他のいくつかのものの中で、Google CDN から jQuery をロードします。次に、特定のプログラム機能をロードするときに、CDN がダウンした場合に備えて、jquery がロードされていることを確認します。私が直面している問題は、まだ2番目のものをロードしていることです。alert("Test");行の後にシンプルを追加するheadTag.appendChild(jqTag);と完全に機能しますが、アラートを削除すると2番目のアラートが使用されます。何を与える？

それらは次のようにロードされます:

<script type="text/javascript" src="i-initializer.js"></script>
<script type="text/javascript" src="i-program.js"></script>

初期化スクリプト:

if(typeof jQuery=='undefined'){
    var headTag = document.getElementsByTagName("head")[0];
    var jqTag = document.createElement('script');
    jqTag.type = 'text/javascript';
    jqTag.src = 'http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js';
    headTag.appendChild(jqTag);
}

次に、別のスクリプトでは次のようになります。

if(typeof jQuery=='undefined'){
    var header = document.getElementsByTagName("head")[0];
    var qtag = document.createElement('script');
    qtag.type = 'text/javascript';
    qtag.src = 'http://feedback.oursite.com/scripts/jquery-1.8.3.min.js';
    qtag.onload = checkjQueryUI;
    header.appendChild(qtag);
}
else
{
    jQCode();
}
jQCode() {
...
}
4

2 に答える 2

17

これはHTML5 Boilerplateで使用される手法です。最初に Google CDN スクリプトをロードし、すぐにグローバルjQueryオブジェクトが存在するかどうかを確認します。存在しない場合、CDN は失敗し、代わりにローカル コピーがロードされます。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.8.3.min.js"><\/script>')</script>
于 2012-12-06T15:09:03.507 に答える
3

フォールバック コードは、jQuery を非同期的に読み込みます。
つまり、残りのスクリプトは jQuery が読み込まれる前に実行されます。

呼び出しを追加するalert()と、残りのコードは強制的に待機します ([OK] をクリックするまで)。その時までに、jQuery はロードされています。

代わりに、 を<script>使用して新しいタグをdocument.write()発行し、同期的にロードすることができます。

または、残りのコードをコールバックでラップし、jQuery の読み込み後にコールバックを呼び出すこともできます。
このようにする場合は、すべてを処理するスクリプト ローダー ライブラリを使用する必要があります。

于 2012-12-06T15:10:26.767 に答える