【JavaScript初心者】jQueryを使うメリットとは

jQueryとはJavaScriptのライブラリであり、DOMの操作を提供するものです。

メリットは２点。

そもそもjQueryとは

jQueryとはJavaScriptのプログラムがまとまって用意されているものであり、使用するとJavaScriptを使いやすいように拡張できます。

jQeryのようなものをライブラリと言います。使用するときはjQueryのファイルを読み込む必要があります。

jQueryはDOMの操作を提供しまおり、読み込むと簡単にDOMの操作ができます。

メリットとして大きく挙げられるのはこの２点です。

クロスブラウザ問題とはJavaScriptを実行するときに同じプログラムでも違うブラウザで実行すると、異なる処理結果になってしまう問題のことです。

例えばChromeとFireFoxでは同じ処理だが、InternetExplorerでは違う処理結果になってしまうと言ったことがあります。

これはJavaScriptに限ったことではなくCSSなどでも起こります。

このクロスブラウザ問題を解決するためにjQueryが生まれました。ブラウザ間の違いを吸収してどのブラウザに関しても同じ処理結果を導いてくれます。

これによってJavaScriptでWebサイト開発時にユーザが使うブラウザ種類によって動かなかったり、予想できない動きをするといった、バグになり得るリスクを減らすことができます。

jQueryではDOM操作のメソッドが用意されているので、JavaScriptのDOM操作よりもかなり簡単に書くことができます。DOMの操作に関して、初心者はJavaScriptよりもjQueryから始めた方がわかりやすいケースもあります。

例えば以下のDOMを例に挙げます。

<span id="foo">こんにちは</span>

このIDがfooの要素の内容「こんにちは」を「こんばんは」に変える場合、それぞれの書き方を比較します。

/* JavaScriptの場合 */
document.getElementByID(‘foo’).innerHTML('こんばんは');

/*jQueryの場合*/
$('#foo').html('こんばんは');

違いがわかりましたか。JavaScriptよりもjQueryで書いた方が文字数も少なく、何よりすっきりした見た目になっています。

この場合は１行なのでそこまで違いは出てきませんが、もし1000行のコードを書くとするならば差は歴然です。

何より見た目がすっきりしているので、コードを読むときもかなり楽です。

また、jQueryはセレクタを指定できるのでCSSを経験していればなんとなく、どこを操作しているのか想像できます。

セレクタの種類に関しては以下の記事でご紹介しています。

デメリットは特にありません。

しいて言うなら処理が遅くなる可能性があることです。jQueryの読み込みが入るのでそこで遅くなる可能性があります。

jQueryとはJavaScriptのライブラリであり、DOMの操作を提供するものです。

メリットは２点。

皆さんもjQueryとは何かと聞かれたときにすぐに答えられるようになって、他の初心者と差をつけましょう！