jQuery マニュアル

jQueryはJavaScriptライブラリです。

ウェブ開発におけるJavaScriptの利用は、その動的な特性と機能性により、多くのウェブページで見かけることができます。しかし、その機能性の一方で、JavaScriptを扱う際には一定の複雑さもあります。ここで、jQueryが登場します。

jQueryを学ぶ前に、以下の知識に基本的な理解を持っている必要があります。

jQueryとは？

jQueryは、よりシンプルに、より短いコードでJavaScriptの機能を活用するためのライブラリです。

アニメーション、HTMLドキュメントの操作、イベントハンドリング、Ajaxによる非同期通信など、様々な機能を含んでいます。このおかげで、開発者は効率的にコードを書くことが可能となり、それにより生産性が向上します。

jQueryを使用するには、まずはjQueryライブラリをあなたのプロジェクトにインクルードする必要があります。

これは、以下のようなタグをHTMLファイルの<head>セクションに追加することで可能です。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

その後、あなたのJavaScriptコード内で、通常のJavaScriptの代わりにjQuery関数を使用することができます。

$(document).ready(function(){
  $("p").click(function(){
    $(this).hide();
  });
});

この例では、すべての<p>要素がクリックされたときに非表示になります。

なぜ scriptタグで type=”text/javascript” を使用しなかったのか疑問に思いませんか?

HTML5 では、その必要はありません。 JavaScript は、HTML5 およびすべての最新のブラウザーのデフォルトのスクリプト言語です。

jQueryには、jquery.min.jsとjquery.jsという二つのバージョンが存在しますが、これらは機能面では全く同じです。それでは何が違うのでしょうか。

それは「圧縮」の違いです。

jquery.min.jsは圧縮（ミニファイ）されたバージョンで、空白やコメントが削除され、変数名が短くされています。その結果、ファイルサイズが小さくなり、ダウンロード時間が短縮されます。

一方、jquery.jsはこれらの圧縮が行われていないバージョンで、デバッグや学習にはこちらを使うと良いでしょう。

jQueryのバージョンを確認するには、コンソールで以下のコマンドを実行します。

console.log(jQuery.fn.jquery);

このコマンドは、使用中のjQueryのバージョン番号をコンソールに出力します。このコマンドを実行するには、Webブラウザの開発者ツールを開き、コンソールタブに移動してコマンドを入力します。