📝

JS jQueryについて

2023/08/09に公開

jQueryとは?

最も広く使われているJavaScriptライブラリのこと。
JavaScriptライブラリ
→JavaScriptを使った開発作業において汎用的に使える機能を再利用できるようにまとめたもの。
jQueryを使うことで、HTML要素の構造や、文字色や背景色などを簡単に変更できるようになる。
(ライブラリは様々な機能、「部品」を再利用できるように集めたもの。)

メリット

①コード量の短縮

短いコード量で済むため、作業量の軽減、コードの可読性が高くなる。

②どのブラウザでも使える

Google ChromeやSafariなど、どのブラウザでも同じコードで同様の動作が行える。
(以前はブラウザによって実行できなかったり、想定通りに動作しなかったりすることがあった)

③Ajaxが手軽に使える

Ajax:JavaScript で非同期通信を行う手法で、JavaScript のみでサーバ通信を行える技術。
Ajax処理を使えば、Webページ全体の再読み込み不要で、非同期でサーバとの通信が可能であるため無駄なページの読み込みを削減できる。

④豊富なプラグインで拡張できる

プラグイン:機能を拡張するために追加するプログラムのこと。
jQueryは拡張性が高く、Webサイトを効率的に作るためのプラグインが豊富 + 独自の機能を搭載したプラグインの自作可能。

⑤学習難易度が低い

簡単でシンプルなコードで記述できるため、初心者向け。
書籍やWeb上に情報が多く乗っているため、不明な部分が出てきても解決しやすい。

実際に使ってみる

jQueryをダウンロードした後、使用したいフォルダ内にjQueryのファイルを保存する。
実際に利用する際には、使用したいフォルダ内に、新たにindex.htmlファイルを作成してjQueryを読み込む。

jQueryを読み込ませる

基本的な書き方
$(function(){
  $( セレクタ ).メソッド( パラメータ );
});

【解説】
セレクタ:そのページ内の、操作対象のHTMLの要素を特定するもの
メソッド:何を行うのか
パラメータ:外から入ってくる値


つまり、「どこに対して何を行うのか」を記述する。

$(function(){
  $('body').html('<h1>Hello JQuery!!</h1>');
});
GitHubで編集を提案

Discussion