IE8以下はjQuery1.X、それ以外は2.XをHTML上で振り分けて読み込ませる方法


jQueryはIE8をサポートするのはバージョン1.Xまでとなっています。
最近は、2.Xが登場し、高速化など行われてましたが、IE9以上などのモダンブラウザのみサポートとなりました。

そこで、ハックを使って、IE8以下は「jQuery1.X」を読み込ませ、それ以外は「jQuery2.X」を読み込ませるようにします。

方法は簡単で、「IEの条件付きコメント」(バージョン ベクタ)を使った方法と、それを応用した方法を組み合わせます。

<!--[if lt IE 9]>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script>window.jQuery || document.write('<script src="js/vendor/jquery-1.11.1.min.js"></script>')</script>
<![endif]-->
<!--[if gte IE 9]><!-->
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script>window.jQuery || document.write('<script src="js/vendor/jquery-2.1.1.min.js"></script>')</script>
<!--<![endif]-->

「IE9未満」([if lt IE 9])を使って、まずIE8以下に「jQuery1.X」を読み込ませます。

その後に、「IE9以上」([if gte IE 9])を使って「jQuery2.X」を読み込ませますが、普通に書くとIEのみ対応になってしまうので、IE8以下は読み込まずに、IE9以上のモダンブラウザであれば読み込むようにハックします。


最新記事はトップページで!

京都発・地方が盛り上がるグルメや観光に撮影ロケ地の話題を提供!