IEの条件付きコメントを使ったjQuery1系2系の使い分け
jQuery2.xとIE
jQueryの1系と2系、実は機能的に大きな違いはありませんが、2系は1系に比べて軽量でかつ高速です。
なぜ軽量で高速なのかというと、2系はIE6~8をサポートしなくなったから。
私は常に最新のバージョンのものを使用したいので、迷わず2系を使用していましたが、やはり古いIEを使用している人はいるもの。サポートしません、という手もありますが、古いIEもサポートするには、やはりjQuery1系を使用しなければいけません。
IEの条件付きコメント
条件付きコメントとは、Microsoft Internet Explorerによって解釈されるHTMLソースコード中にある条件付きのステートメントである。条件付きコメントは、マイクロソフトのInternet Explorer 5ブラウザーで初めて登場し、バージョン9までサポートされた。なお、バージョン10以降はこの機能は廃止され、他のブラウザと同様、単なるコメントとして扱われる事となった。 Wikipedia
条件付きコメントとは、Microsoft Internet Explorerによって解釈されるHTMLソースコード中にある条件付きのステートメントである。条件付きコメントは、マイクロソフトのInternet Explorer 5ブラウザーで初めて登場し、バージョン9までサポートされた。なお、バージョン10以降はこの機能は廃止され、他のブラウザと同様、単なるコメントとして扱われる事となった。 Wikipedia
この条件付きコメントを使用することで、古いIEはjQuery1系を使用し、IE9以上かつIE以外のブラウザは2系を使用するということが可能になります。
なお、jQueryの1.10と2.0、1.11と2.1のようにペアになっておりそれぞれ互換性をもっています。1系は1.10、2系は2.1.1を使用するなどバージョンの齟齬がおきないようにしましょう。
使用可能な演算子
IE6以上だの未満だのIE6を含むとか含まないとかいろいろ指定はできますが、今回は、jQuery1系2系をそれぞれ使用する場合を想定し、IE8以下か、IE9以上かを判定する方法を説明します。
IE8以下かどうか
<!--[if lte IE8]>
<script type="text/javascript" src="/jquery/1.11.1/jquery.min.js"></script>
<![endif]-->
ltの場合、IE8を含まない、e(=equal)をつけるとIE8を含む
IE9以上かどうか
<!--[if gte IE9]>
<script type="text/javascript" src="/jquery/2.1.1/jquery.min.js"></script>
<![endif]-->
gtの場合、IE9を含まない、e(=equal)をつけるとIE9を含む
IE9以上、かつIE以外のブラウザに対応する場合
<!--[if gte IE 9]><!-->
<script type="text/javascript" src="/jquery/2.1.1/jquery.min.js"></script>
<!--<![endif]-->
jQuey Migrate
1系だの2系だのいってきましたが、1系の中でもバージョン1.9から大きな変更が加えられ、いくつかの機能が削除されました。
現在は削除されていないものの削除予定のものや、今後削除されていく機能はあると思います。
バージョンがあがることで突如機能が削除されることはなく、削除予定段階を経て削除されるわけですが、それでもすぐにバージョンアップに対応するのは難しいということもあります。
そんなときは、jQuery Migrate機能を使用することで、最新のjQueryを使用しつつ、削除済み機能を使用するということが可能になります。
非圧縮版のMigrateを使用した場合、Firebugなどのコンソールに、使用中のjQueryバージョンではdeprecatedだよーとかremovedだよーといった警告を表示してくれます。
デバッグやバージョンアップのためのテストを行っている場合であれば、この警告を利用してdeprecatedやremovedな機能を最新のものに置き換えるヒントになるかもしれません。
使用方法は簡単、ただMigrateファイルを読み込むだけです。
サンプルはCDNのファイルを使用した方法です。
非圧縮版
削除予定、もしくは削除済みのメソッドを使用した場合、コンソールに警告を発します。
<script type="text/javascript" src="http://code.jquery.com/jquery-migrate-1.2.1.js"></script>
圧縮版
非圧縮版と異なり、警告はでません。通常使用時と違和感無く使用できます。
<script type="text/javascript" src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
Author And Source
この問題について(IEの条件付きコメントを使ったjQuery1系2系の使い分け), 我々は、より多くの情報をここで見つけました https://qiita.com/nmta/items/47cad749db2bfeb319b7著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .