[JQuery] JQueryを導入する

ここではJQueryをHTMLに組み込む方法について説明します。
広 告
目次
前提条件
- 特になし
動作確認端末
- 特になし
1. JQueryを導入する
JQueryを導入するためには、あらかじめダウンロードしたJQueryファイルを読み込むか、ホストされているJQueryファイルを読み込むかの2通りがあります。

JQueryファイルは、JQuery公式ページからダウンロードすることができます。ページ右上の「Download JQuery」ボタンをクリックします。

JQueryファイルのダウンロードページが表示されるので、導入したいバージョンのリンクをクリックしてダウンロードします。
JQueryをHTMLファイルに組み込むためには以下のように<script>
タグを使用します。src
属性に設定する値はHTMLファイルから見た相対パスになります。
ダウンロードしたJQueryファイルを組み込む
<!doctype html> <html> ... <script src="jquery-2.2.0.min.js"></script> ... </html>
ホストされているJQueryファイルを利用する場合は、<script>
タグのsrc
属性に、そのURLを設定することで組ことができます。
ホストされているJQueryファイルを組み込む
<!doctype html> <html> ... <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> ... </html>
2. JQueryのバージョン
JQueryには、1.x系と2.x系の2種類のバージョンが用意されています。各々の違いは主に動作サポートするブラウザにあります。2.x系の方が軽量かつ高速で動作も安定していますが、IE6/7/8はサポート対象外になっています。
対象ブラウザバージョン一覧
ブラウザ | JQuery 1.x | JQuery 2.x |
Internet Explorer | 6以上 | 9以上 |
Chrome | 最新版 | |
Firefox | 最新版 | |
Safari | 5.1以上 | |
Opera | 12.1x、最新版 | |
iOS | 6.1以上 | |
Android | 2.3、4.0以上 |
3. compressとuncompress
JQuery1.x系とJQuery2.x系には、どちらにもcompress版とuncompress版の2種類があります。
compress版は「圧縮版」で、uncompress版は「非圧縮版」になります。前者の方が軽量化されているため、特別な理由がない限りは、compress版を利用した方がよいです。