7

Zeptoから jQuery (特に IE の場合) にフォールバックする方法を指示または質問するページを見てきました。Modernizr.load doc page
のように、Google がホストする jQuery からローカル サイトの jQuery にフォールバックする方法の例も見てきました。

私の質問は、どうすれば 2 つのものを組み合わせることができるかということです。おそらくModernizr.loadを使用せずに、適切な<script>ブロックを使用するだけですか?

これが私が思いついたものですが、IEはGoogleがホストするバージョンを見つけられないようです。また、Zepto = jQuery割り当てが適切に機能するかどうかもわかりません。

<script>
    document.write('<script src=' +
        ('__proto__' in {} ? 
            'js/vendor/zepto.min' : 
            'https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min') +
        '.js><\/script>');
</script>
<script>
    if (window.jQuery) { 
        window.Zepto = window.jQuery; /* let jQuery alias Zepto */ 
    }
    else
    { /* here jQuery could be rightly undefined because Zepto is loaded, 
         so this could be wrong. */
        document.write('<script src=' +
            'js/vendor/jquery-1.8.0.min' +
            '.js><\/script>');
    }
</script>
<script>
    if (window.jQuery) { 
        window.Zepto = window.jQuery; /* let jQuery alias Zepto */ 
    }
    else
    {
        /* same problem as before */
        console.error('Zepto nor jQuery available!');
    }
</script>

より良い方法はありますか？TA

編集

@Ashfameの回答の後、これは私が使用したものです：

<!-- Load local Zepto.js or (as a fallback) jQuery from Google CDN or (as a fallback) local jQuery -->
<script>
    document.write('<script src="' + ('__proto__' in {} ? 
        'js/vendor/zepto' : 
        'http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery') + 
        '.min.js"><\/script>')
</script>
<script>
    window.Zepto || window.jQuery || document.write('<script src="js/vendor/jquery-1.8.0.min.js"><\/script>');
</script>

Google CDN のプロトコルレス/スキームレス URL は、何らかの理由でローカル IE9 で機能しなかったため、使用できませんでした (かなり待機した後、常にローカルにフォールバックします)。

私はもう : でエイリアスを作成しませんでしたがZepto、JS コードjQueryで使用されました。$

jQuery の順不同の wrt 依存コードのロードに関連する問題は発生していないようです。

4

1 に答える 1

6

この手法を試すために、まずこれを試してみます。

これは、jQuery CDN がダウンしたときに HTML5 ボイラープレートがローカル フォールバックをロードする方法に沿って簡単に書きました。

これはうまくいかないかもしれませんが、今はうまくいかない理由がわかりません。試してみませんか？

<script>document.write('<script src="' + ('__proto__' in {} ? 'cdn/zepto.min' :  'cdn/jquery.min') + '.js">\x3Cscript>');</script>
<script>window.Zepto || window.jQuery || document.write('<script src="cdn/jquery.min.js">\x3C/script>')</script>
<script>window.Zepto || window.jQuery || document.write('<script src="local/jquery.min.js">\x3C/script>')</script>

うまく処理できない唯一のケースは、ユーザーが IE などの Zepto と互換性のないブラウザーを使用していて、同時に jQuery CDN がダウンしている場合です。その後、jQuery CDN をもう一度ロードしようとし、最終的にローカルにフォールバックします。 jQueryのコピー。

しかし、実際には、これを実装すると、ローカルへのフォールバックが 1 つだけになります。同様に、Zepto や jQuery をロードできるかどうかを確認し、次のステップで、どちらもロードされていない場合は、ローカル ライブラリをロードします。それほど多くの利益をもたらさないものを最適化しようとするよりも、何かを適切に機能させる方がよいでしょう。賢く最適化しましょう！上記の手法 #1 には、ブラウザ間の互換性に関する独自の注意点がある可能性が非常に高くなります。

この問題を見つけたところ、この手法 (HTML5 Boilerplate と Modernizr で使用および推奨されています) でさえ信頼性がありません。この問題を確認してください - document.write フォールバックにより jQuery が順不同で読み込まれる

その質問の別の解決策は、ライブラリ Yepnope について語っています。それがどのように機能するかを確認できます- https://stackoverflow.com/a/12323328/551713

最後に、この回答を締めくくるには、完全に自分のコードになるものを作成する場合を除き、たとえば、ユーザーがページにさらに多くのものを追加する可能性があるため、あまり気にしないでください。他のスクリプトが順不同でロードされて問題が発生する可能性があるため、このような手法ではすぐに問題が発生しますが、すべてのコードがフォールバックのロジックに従ってロードおよび動作する可能性があります。

于 2012-11-30T20:10:17.507 に答える