jQuery Tips

jQueryをCDNから読み込む際のフォールバック

jQueryを使う場合、読み込みを高速化するためにCDNを利用する事がある。

この時、何らかの理由でCDNから読み込みができない場合、自前で用意したjQueryを読み込むというフォールバックの方法を解説する。

CDNはGoogleを利用するとした場合、フォールバックのコードは次のようになる（パスは自サイトの状況に合わせて変更する事）。

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script>window.jQuery || document.write( '<script src="//assets/js/jquery-2.0.0.min.js"><\/script>' )</script>

上記のコードを簡単に解説する。

まず、1行目はGoogleのCDNからjQueryを読み込む処理になっている。

続く2行目はjQueryが読み込まれているか、つまりCDNから読み込みが完了したかを判定している。

そしてCDNから読み込まれていなければ自前で用意したjQueryを読み込む処理になっている。

ちなみに、先述したコードをIE8までとIE9以降で分岐させる

IE8以前とIE9以降で読み込むjQueryのバージョンを変える

IE8以前とIE9以降で読み込むjQueryのバージョンを変える方法について。

IEのバージョンで分岐させる命令を使い、次のコードのように書く。

<!--[if lt IE 9]>
<script src="//assets/js/jquery-1.9.0.min.js"></script>
<![endif]-->
<!--[if gte IE 9]><!-->
<script src="//assets/js/jquery-2.0.0.min.js"></script>
<!--<![endif]-->