【jQuery】jQuery本格入門をまとめてみる

2015年9月22日JavaScript

こんにちは、しきゆらです

今回は技術評論社から出版されている「jQuery本格入門」という本の内容をまとめて行きたいと思います

 

Amazonリンク

[amazonjs asin="4774169900″ locale="JP" title="改訂新版 jQuery本格入門"]

先日のインターンシップで少し触ったので、もう少し触れてみようと思ったわけです

普通のJavaScriptで書くよりも手軽だったりするんで、見てみましょう

 


 

jQueryとはなんぞや?

まず、jQueryとは何ぞや、というところからですね

jQueryとは、JavaScriptのライブラリの一つで、もっともメジャーなライブラリの一つです

普通にJavaScriptを書くより、手軽に記述できたり、ブラウザごとに書き方を変えなくてもいい

などの理由からよく使われるライブラリとなっています

 

jQueryはバージョンが1.x、2.xの2種類あります

違いは、1.x系列はIE6~8への対応を含んでいて、2.x系列は対応が含んでいないものになっています

制作するサイトやアプリなどによって使い分けが必要になりそうですいね

最新のブラウザで動けばいい、という場合は2.x系列を使えば問題ないでしょう

 

jQueryの特徴

シンプルに記述できる

先ほども書きましたが、JavaScriptプログラミングを行う場合は、ブラウザごとに記述の仕方が異なる場合があります

(現在はブラウザごとの処理の差などが無いように統一に向かっているようです)

jQueryの場合はメソッドを実行することで、各ブラウザにあった処理を行ってくれます

 

機能を拡張できる

jQueryだけでも十分機能が充実しているわけですが、さらにプラグインを追加することで機能を拡張することができます

ただし、プラグインが対応しているバージョンが限られる場合があるので使用する場合は確認しましょう

 

開発環境でサポートされている

Visual Studioでは、コードの補完や、メソッドの説明などが表示されるようになっています

そして、Ruby on RailsではデフォルトのJavaScriptライブラリとして採用されています

(他にも特徴がありますがこの辺で・・・)

 

jQueryの前提知識

jQueryはよく使われるライブラリということで、ネットで検索すればたくさんの情報が出てきます

しかし、ほぼすべての情報原は公式サイト、ということでjQueryの公式サイトなどを以下に示します

 

jQuery公式サイトhttps://jquery.com

最新情報はここから発信されるので、定期的に覗いてみるといいかと(英語)

公式APIドキュメントhttp://api.jquery.com/

メソッドの説明などはここで確認(英語)

公式ブログhttp://blog.jquery.com/

開発状況などがのぞけるかと(英語)

 

その他、ためになりそうなサイト

jQuery 日本語リファレンスhttp://semooh.jp/jquery/

リファレンスが日本語で読めるサイト

更新履歴が2010年で止まっています・・・参考程度に

(今後追加するかもです)

 

jQueryを利用するための手順

jQueryの使い方を見てみます

利用するための方法は2種類あります

 

1つ目は、jQueryをダウンロードして利用する方法です

公式サイトからダウンロードし、HTMLのsrc属性にパスを指定することで利用します

利用する環境が、常にネットワークに接続できない場合はこちらの方法で利用することになると思います

 

2つ目は、ネットワーク越しに読み込む方法です

この場合は、src要素にURLを指定することで利用します

指定するURLは、例えばこのようなものがあります

ここでは、2.x系最新版(2015年9月27日現在)を例に見てみます

・jQueryのCDN

http://code.jquery.com/jquery-2.1.4.js

(バージョン一覧はこちら)

・GoogleのCDN

https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js

(バージョン一覧はこちら)

・MicrosoftのCDN

http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.1.4.js

(バージョン一覧はこちら

普通はこの方法で問題ないかと思います


※CDNとは?

CDNとは、Content Delivery Network(コンテンツ・デリバリ・ネットワーク)の略で

データなどを配信するためのネットワークのことです

※minがあるものとないものの違いは?

minが付いているものはファイルサイズを小さくするために、インデントなどを行わず記述を圧縮したものになります

min無しは普通にインデントなどを含んだものになります(若干ではありますが、ファイルサイズがminより大きい)

通常はminありのほうがダウンロードに時間が短いのでこちらを選ぶのが無難かと思います


 

おわりに

今回はjQuery利用の前段階をまとめてみました

かなり情報を端折っているので、どんなものかわかりにくいかもしれません・・・

実際に触ってみるのは次回以降ということで

 

おわり

 

Posted by しきゆら