先日、jQuery Migrate という jQuery のプラグインがあることを知りました。
サーバサイドばかりやっていると UI が疎かになりますね...。
目次
jQuery
おさらい
jQuery は JavaScript で書かれた便利なライブラリのパッケージです。
ライブラリには様々な関数が登録されており、それを呼び出すことで以下のような効果を得ることが出来ます。
- 時短
予め用意されている関数で事足りる場合、かなりの省力化が期待できます。 - コードの冗長化を防ぐ
関数を呼び出す前のソース(コード)については固定化されるため、完全オリジナル、且つ自由な環境よりもコードがシンプルになる傾向があります。 - クロスブラウザ対応
ブラウザには Chromium 系、Firefox系、Edge(IE)系 などありますが、これらは系統によって JavaScript の解釈の仕方(や HTML・CSS の解釈の仕方)が異なる部分があります。
この異なる部分の差異も吸収してくれるため、省力化・短いコードで開発を行うことが出来ます。
※Firefox の前身は IE としのぎを削った Netscape Navigator です。
※Edge は Chromium へ舵を切りました。
バージョン
jQuery 3.x では、1.x / 2.x が 3.x 系統に統合されました。
これは、Microsoft が古いバージョンの IE サポートを終了すると発表したことによります。
また、3.x にまとめられたことにより、提供版に Slim が追加されています。
- 製品版(Production)
- 開発版(Development)
- スリム版(Slim)
バージョン | 概要 | サポート |
---|---|---|
1.x | 互換性重視(古いブラウザもサポート) | サポート有り |
2.x | 軽量化優先(モダンブラウザをサポート) | サポート有り |
3.x | モダンブラウザをサポート | 現行リリース |
※現行リリースと明記した 3.x 系も、既に 2016年にリリースされた jQuery 3.4 が最後のマイナーリリースと発表されているため、jQuery 4.x の登場も近そうです。
ブラウザのサポート範囲
jQuery のサポート対象については以下のようになっています。
対象ブラウザ | サポートバージョン | 備考 |
---|---|---|
Internet Explorer | 9 以降 | |
Edge | 最新安定版と、その1つ前のバージョン | |
Chromium / Chrome | 最新安定版と、その1つ前のバージョン | |
Firefox | 最新安定版と、その1つ前のバージョン、ESR | |
Opera | 最新安定版 | |
Safari | 最新安定版と、その1つ前のバージョン | |
Stock browser on Android | 4.0 以上 | Android 標準ブラウザ |
Safari on iOS(Mobile) | 7 以上 |
jQuery Migrate
概要
jQuery Migrate はその名の通り、jQuery 本体のバージョンアップをサポートしてくれるツールです。
(どの言語にもありますが)jQuery は特定のバージョン間で破壊的な変更がされており、jQuery 本体を差し替えただけだと動かないケースがあります。
また、動くけれども近い将来に動かなくなる可能性のソースを教えてくれる昨日もあります。
種類
開発版・製品版の2種類あり、それぞれ配布方法・機能が異なります。
- 製品版
ファイルが圧縮されている。
- ファイル名
jquery-migrate-x.x.x.min.js -
開発版
ファイルが可読性を重視した形式になっている。
- ファイル名
jquery-migrate-x.x.x.js
できること
- 製品版
廃止された機能を復元する(呼び出してもエラーにならず正常に処理される)。 - 開発版
廃止された機能を呼び出すと、ブラウザのコンソールに警告を表示する。
開発版で警告が表示されるものでも、製品版で問題なければひとまずそのまま運用が可能です。
※開発版で警告表示されるものは非推奨のため、近い将来対応が必要になる可能性あり。
使い方
jQuery 本体のバージョンによって jQuery Migrate の使用方法が変わります。
- jQuery 本体のバージョンが 1.11.0 / 2.1.0 より古い場合
「Ver 1.x 移行作業」実施の後、「Ver 3.x 移行作業」を実施。 - 上記以外
「Ver 3.x 移行作業」を実施。
※現在 1.x / 2.x はセキュリティフィックスは提供されていますので、無理やり 3.x に VerUP する必要はありません。
Ver 1.x 移行作業
以下の要領でソースを修正します。
- 任意のバージョンの jQuery 本体を読み込む
- 1.x 用 jQuery Migrate を読み込む
GitHub - jquery/jquery-migrate at 1.x-stable - 修正
開発ツールに表示される警告内容を参考にソースを修正する。
※必要に応じて jQuery プラグインも VerUP します。
Ver 3.x 移行作業
以下の要領でソースを修正します。
- 任意のバージョンの jQuery 本体を読み込む
- 3.x 用 jQuery Migrate を読み込む
GitHub - jquery/jquery-migrate: APIs and features removed from jQuery core - 修正
開発ツールに表示される警告内容を参考にソースを修正する。
※必要に応じて jQuery プラグインも VerUP します。