2

最初の場所からの読み込みに失敗した場合、別の場所からjavaScriptソースファイルの読み込みを試みることは可能ですか？

たとえば、HTMLファイルでは、次のようになります。

<script type="text/javascript" src="http://domain.com/javascript_file.js"></script>

しかし、それがロードに失敗した場合は、代わりにこの2番目の場所からファイルをロードしようとすることができます。

<script src="directory/javascript_file.js" type="text/javascript"></script>

ありがとう！

4

2 に答える 2

2

これを行うには、 yepnope.jsを使用することをお勧めします。jQueryを使用した例を次に示します。

yepnope({
  load: 'http:/­/ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js',
  complete: function () {
    if (!window.jQuery) {
      yepnope('local/jquery.min.js');
    }
  }
});

外部ファイルのロードの失敗を検出する何らかの方法があることを確認する必要があります。

于 2012-02-21T01:24:32.890 に答える
2

それが可能だ。

私はおそらく次のようにアプローチします：

まず、スクリプトをロードする関数を作成します。

function loadScript(src) {
    var s = document.createElement('script'), x;
    s.type = 'text/javascript';
    s.async = true;
    s.src = src;
    x = document.getElementsByTagName('script')[0]; 
    x.parentNode.insertBefore(x, s);
}

スクリプトをロードするにはこれで十分ですが、ロードが完了したのか、まったくロードされなかったのかをどのようにして知ることができますか？

2つのコールバックパラメーター（1つは成功用、もう1つは失敗用）とタイムアウトパラメーターを追加しましょう。また、要素にイベントリスナーをアタッチして、scriptロード時にコールバックを起動する必要があります。

function loadScript(src, onSuccess, onFail, timeout) {
    var s = document.createElement('script'), x, loaded;
    s.type = 'text/javascript';
    s.async = true;
    s.src = src;

    s.onload = s.onreadystatechange = function() {
        if (''+s.readyState).match(/^(|complete|loaded|uninitialized)$/) {
            loaded = true;
            onSuccess && onSuccess();
            s.onload = s.onreadystatechange = null;
        }
    }

    if (onFail) {
        setTimeout(function(){loaded || onFail();}, timeout || 5000);
    }

    x = document.getElementsByTagName('script')[0]; 
    x.parentNode.insertBefore(x, s);
}

完全な開示：

  • これは完全にテストされていません。
  • コードの最初のブロックはGoogleAnalyticsから削除され、醜いコードは少し少なくなっています。
  • コードの2番目のブロックは、Slaceの回答を見た後、少し醜いがより簡潔なコードでyepnopeから削除されます。
于 2012-02-21T02:07:09.250 に答える