HTML5 で JavaScript の代替ソースを用意することは可能ですか? たとえば、私は jQuery を使用しており、ローカルに持っています。しかし、alt
属性を含めることを許可したので、それが機能しない場合、Google の jQuery が読み込まれますか?
これが機能する場合、コードは次のようになります。<script src="enter your text here.js" alt="googlescode"></script>
HTML5 で JavaScript の代替ソースを用意することは可能ですか? たとえば、私は jQuery を使用しており、ローカルに持っています。しかし、alt
属性を含めることを許可したので、それが機能しない場合、Google の jQuery が読み込まれますか?
これが機能する場合、コードは次のようになります。<script src="enter your text here.js" alt="googlescode"></script>
はい、できます。HTML5 Boilerplateには、jQuery の読み込みの良い例があります。
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.2.min.js"><\/script>')</script>
しかし、それは逆に使用されます。Google からのスクリプトを読み込めなかった場合は、ローカル スクリプトにフォールバックします。
CDN バージョンは「ローカル」バージョンよりも速く読み込まれるため、とにかく最初の試行として読み込む必要があります。
jQueryなら、こちらの記事をご覧になるといいかもしれません。
スニペット:
<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-2.0.0.min.js"></script>
<script>
if (typeof jQuery == 'undefined') {
document.write(unescape("%3Cscript src='/js/jquery-2.0.0.min.js' type='text/javascript'%3E%3C/script%3E"));
}
</script>
document.write
それらを実装するとき、以前のすべての回答には、同期関数であるため、接続が遅いとChromeがそれらをブロックするという共通の問題があることに気付きました。この問題については、この投稿で説明しています。
解決策は通常、moderns ローダーを使用するか、js コードを事前にコンパイルすることです。
ただし、ユースケースでこのアプローチが必要な場合は、非同期呼び出しを使用する必要があります。分かりやすい例として、Google アナリティクスの読み込み方法があります。
基本的に、上記のコードは次のように変換されます。
<script>window.jQuery || (function(){
// Create the DOM node
a=document.createElement('script');
a.src="http://path-to-the-script.js";
a.async=1;
// Find a node, and insert the script before it
m=document.getElementsByTagName('script')[0];
m.parentNode.insertBefore(a,m);
})()</script>