HOME > - JavaScript >
- jQueryとは？【使い方を解説】
jQueryとは？
jQueryとはJavascriptのライブラリ（Javascriptで作った機能を簡単なコードで使い回しが効くようにまとめたもの）の代表的なもののひとつで、 Javascript自体をより簡単なコードの記述で使うことが出来るようにしたものです。
jQueryを使うメリット
Javascriptで行う処理を短く簡単なコードで扱うことが出来るので作業負担は軽減されます。
jQueryではほぼ直接といっても過言ではなくHTMLやCSSのセレクタを指定して値の変更などを行うことが出来るので 直感的に記述していくことが出来ます。
初めてプログラミング言語を学習される方にとっても、いきなりJavascriptを学ぶよりもJQueryから学習し始めることによりプログラミング言語の記述の流れなどを理解しやすくなると思います。
jQueryを使うには？
jQueryをサイトに読み込むことで使用できる
jQueryはjQueryのファイルを読み込んで使用します。
公式サイトからファイルをダウンロードして自身のサーバーにアップして読み込む方法と、CDNというオンライン上に公開されているデータを直接読み込む方法があります。
CDNで読み込む場合は、
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
を自身のサイトの</head>の直前に貼りつければOKです。
<!DOCTYPE>
<html>
<head>
<title>sample</title>
-省略-
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
-省略-
</body>
</html>
|
|---|
jQueryの記述の仕方
jQuery本体をサイトに読み込ませたら、いよいよjQueryを記述していきます。
HTMLの中に記述する場合は、<script></script>タグの中に記述していきます。
HTMLやCSSを操作する際の基本としては、$("")の中にタグやセレクタを記述して操作する対象を指定します。
こうして指定した対象に対してメソッドと呼ばれるあらかじめ用意された操作の命令文を使って実際に処理を行います。
例としてjQueryを使用してテキストの書き換えを行ってみます。
<p>おはようございます。</p>
<p>よろしくお願いします。</p>
|
おはようございます。 よろしくお願いします。 |
|---|
「おはようございます。」を「こんにちは。」に書き換えます。
<script>
jQuery(function($){
$("#sample").text("こんにちは。");
});
</script>
<p id="sample">おはようございます。</p>
<p>よろしくお願いします。</p>
|
おはようございます。 よろしくお願いします。 |
|---|
最初に記述した$(function(){は、jQueryを使う上での定型文のようなものです。
$("#sample")で対象のセレクタを指定し、text()メソッドでテキストを書き換えるように操作しています。
セレクタとメソッドは「.」（ドット）でつなぎます。
まとめ
jQueryを使用することでJavascriptよりも直感的に記述できるので初心者でも比較的簡単に扱うことが出来ると思います。Javascriptを使うべきではないという 記事も見かけますが、個人的には簡単なjQueryから習得に取り掛かったことでプログラミングそのものへの理解が深まったと感じていますので初心者の方には 最初の足がかりとしてjQueryを学ぶことをオススメします。
