こんにちはNAOです。
今回はjQueryがどういうものなのかを解説していきたいと思います。
jQueryとは?
jQueryとは、JavaScriptのライブラリの1つです。
JavaScriptは、様々な動作をブラウザ上で行うことができ、非常に便利な言語ではあるのですが、
簡単なことをするだけでもコードを何行も書く必要があります。
また、記述の方法が難しかったり、決して使い勝手がいい言語とはいえません。
そこで、JavaScriptをもっと簡単に使うために登場したのがJavaScriptのライブラリです。
JavaScriptのライブラリには、jQueryをはじめ、Prototype、MooToolsなどがあります。
・jQuery
http://jquery.com/
・Prototype
http://prototypejs.org/
・MooTools
http://mootools.net/
JavaScriptのライブラリが出始めた頃は、jQueryとPrototypeが人気を二分していたのですが、
最近ではjQueryに軍配が上がり、デファクトスタンダード(業界標準)となりつつあります。
jQueryの特徴
他のライブラリとjQueryが違うのは、その軽量性と使いやすさにあります。
軽量性
jQueryのファイルの容量は、豊富な機能を持っているにもかかわらず、100KB弱とかなり軽量です。
容量が軽いということは、それだけ読み込みも早くなるということです。
読み込みが早ければ、それだけjQueryが早く始動しますし、ユーザーのストレスをなくすことにつながります。結果、快適なブラウジングを提供することができます。
使いやすさ
jQueryを使うと、何か思い描く動作を実現しようとした際、記述が非常に短くて済みます。
JavaScriptでプログラミングすると何行も書かないといけないところを、ほんの数行、時には1行だけで済んでしまうこともあります。
この手軽さが利用者数を増やしてきた要因かと思います。
例えば、strongタグの文字の色を緑に変えたい、という場合、jQueryでは以下のように書くだけで文字の色を変えることができます。
1 2 3 |
$(function() { $("strong").css("color","green"); }); |
記述自体も簡潔ですし、見た際に意味を理解しやすいですね。
また、jQueryは書籍やネット上での情報も豊富に出ており、わからないところがあっても調べやすくなっています。情報量が多いとそれだけ悩む時間が減りますので、開発がスムーズに進みます。
私は初めの頃はprogateで学習を深めていました。
https://prog-8.com/users/sign_in
どのブラウザでも使える
プログラミングになるとブラウザで見え方が代わるということが一般的にあります。
ですが、
IE(Internet Explorer)や、Firefox、Google Chrome、Safariなど、主要なブラウザで問題なく使えるようになっています。そのため、ブラウザの違いを意識することなく、プログラミングに専念することができます。
(ただし、複雑なものになるとブラウザごとに動作に差異が出てくることもありますので、その点は注意をして対応する必要があります。)
jQueryを使ったプラグインが多く公開されている
ネット上では、jQueryを利用して作られたプラグイン(追加機能)が、非常に多く公開されています。
それらのほとんどは、MITライセンスなどの緩いライセンスで、利用者が自由に自分のサイトに組み込むことができます。
例えば、「こんなことがしたい」と思った時、すでにそういうプラグインを作っている方がいれば、それを利用させてもらうことで、一からコーディングする手間が省けます。
jQueryではこのようなプラグインが多く公開されているため、ほとんどコードを書かなくても、プラグインを利用するだけでレベルの高い動作を実現することができます。
MITライセンスで公開されたプログラムは、無料で使用することができます。
著作権の表示はそのままにしておく必要がありますが、それ以外は改変も自由です。
jQueryでできること
下記のように様々な状況で使用することができます。
・文章や画像を変更する
・CSSを変更する
・数秒おきに画像を切り替える
・ページを遷移せずに、別のページを表示させる
・リアルタイムに入力フォームのチェックを行う
他にも挙げればキリがないぐらいです。
JavaScriptで書くよりもjQueryを使ったほうが格段に早く、簡単に実現できますので、jQueryがよく使われているのです。
ネット上にjQueryのライブラリが上がっていますのでコピペで使えるものも多いです。
まとめ
今回はjQueryとはどういうものかと言う入りの部分を解説させていただきました。
次回はポイントごとに紹介させていただきます。
ありがとうございました。