jQuery ~ 入門記事、プログラミング解説、Tipsなどのまとめ
もっとも人気のあるAjaxライブラリの1つjQueryの入門記事、プログラミング解説、Tipsなどのまとめ
2009年現在、もっとも勢いがあり、よく使われているAjaxライブラリがjQueryです。jQueryは2006年1月に最初のバージョンをリリースし、急速に普及してきました。サイズが小さく、記述がシンプルで、さまざまな視覚効果を簡単に実装できるのが特徴です。プラグインで機能を追加することもできます。
jQueryは、Mozilla FoundationのJohn Resig氏によって開発されています。2008年9月にはマイクロソフトとノキアがjQueryの正式サポートを決定しました。マイクロソフトはASP.NET AJAXでjQueryを正式サポートしVisual Studioで対応。ノキアはスマートフォンのS60用Web開発ツールでjQueryを正式採用しています。
- jQueryとMicrosoft - @IT
Microsoftの本社副社長ScottGu氏のブログの日本語訳
jQueryの公式サイトとリファレンスマニュアル
jQueryのホームページやリファレンスマニュアルは英語版のみです。
- jQuery: The Write Less, Do More, JavaScript Library (英語)
jQueryの公式サイト - Main Page - jQuery JavaScript Library (英語)
公式サイトのドキュメント。Getting Started、API Reference、Pluginsなど
独自に日本語リファレンスが公開されています。
- jQuery 日本語リファレンス - semooh.jp
APIリファレンス、逆引きサンプル集、アルファベット順APIリストなど使いやすい工夫がされている。定期的に更新されている点も安心 - jQuery リファレンス - 古籏一浩
こちらも定期的に更新されており、過去のバージョンのリファレンスも参照可能
jQueryのAPIやセレクタをもっと便利に参照するためのツールもあります。
- jQuery API Browser v1.3 (英語)
jQueryのAPIを種類別にマウスクリックで調べていけるオンラインサービス。オフラインでも動作するスタンドアロン版もある
Selectorsは、jQueryで分かりにくいセレクタ関数が、実際に何を意味するかをビジュアルに把握できるツールです。
jQueryの入門記事
jQueryとは何かを把握するために、すぐに目を通せる記事を3本選びました。1つ目の「はじめてのjQuery」が簡単でおすすめです。
- はじめてのjQuery (スライド)
デザイナ向けに書かれたスライド。「CSSができるならjQueryもできるはず」と、魔法の呪文とメソッドというjQueryの基礎知識を紹介 - デザイナ向け「はじめてのjQuery」 - あと味
上記のスライドの作成者による背景説明 - ウノウラボ Unoh Labs: JavaScriptライブラリといえば jQuery(入門編)
jQueryの特徴「名前空間をよごさない」「要素の選択がらくらく」「メソッドチェーン」「イベント処理」「Ajax」「プラグイン」を、シンプルなソースコートで解説しています
実際にjQueryで何かを作ろう、というプログラマやデザイナーのための入門記事は、以下の記事をおすすめします。
- jQueryによるJavaScript入門-Re:Creator's Kansai (リクリ)
jQueryによるCSS操作やCSS3の先取り、タブパネルやツールチップといった視覚効果の実装など、主にデザイナ向けに具体的なプログラミング方法を解説 - 特集:jQueryではじめるAjax|gihyo.jp
YouTube API、JSONP、サジェスト機能、jQuery UIによるユーザーインターフェイスの改良の紹介。jQueryを使ったマッシュアップをしたいプログラマ向け - ASP.NETプログラマーのためのjQuery入門 - @IT
VIsual StudioでjQueryを利用するための設定方法、jQueryの構文、メソッドチェーン、イベント処理、そしてjQuery UIの紹介と、コンパクトだが十分な内容。ASP.NETプログラマでなくともjQuery入門記事として参考になるはず - Aptanaで始めるJavaScriptライブラリ「jQuery」超入門 (1/3) ─ @IT
フリーの統合開発環境であるAptanaを用いつつ、jQueryのインストールや基本的な使い方から丁寧に解説 - jQuery入門(その1):CodeZine
プログラマを対象に書かれた入門記事。すべて読むには登録が必要
そのほかにも分かりやすく書かれた入門記事を2本紹介しましょう。
jQueryプログラマ向けの解説記事
DOM操作をより簡単に行うなど、jQueryはJavaScriptの高度なプログラミングに役立つライブラリとして使えます。プログラマに向けた解説記事を紹介しましょう。特に4本目の「特集:jquery.jsを読み解く」は、jQuery 1.2.2ノソースコードを詳細に分析するという、非常に読み応えのある記事です。
- jQuery を使って Ajax 開発を単純化する - developerWorks
- jQueryを扱う - developerWorks
- 連載インデックス「jQueryで学ぶ簡単で効果的なAjaxの使い方」 - @IT
- 特集:jquery.jsを読み解く|gihyo.jp
jQueryの開発者であるJohn Resig氏自身のスライドによるjQueryの解説を読むのはいかがでしょうか。
jQuery Tips&サンプル
さらにjQueryを使いこなして行くには、さまざまなサンプルを見たり、Tipsを知ることが早道です。ネット上には数多くのサンプルとTipsが掲載されています。ここでは主なものを紹介しましょう。
- Use jQuery - Showcase of sites that use jQuery
jQueryを用いたWebサイトのショーケース。自薦他薦も可能。 - ナビゲーションのUIはこれで完璧かもなjQueryプラグイン集:phpspot開発日誌
- jQuery超初心者にありがちな6つの間違い - あじゃぱー
- ウノウラボ Unoh Labs: jQueryのパフォーマンス最適化に関するTips
- 一晩で覚えるjQueryの逆引き基礎サンプル7つ*ホームページを作る人のネタ帳
- Re:一晩で覚えるjQueryの逆引き基礎サンプル7つ (でぃべろっぱーず・さいど)
- jQueryの魔法 - [JavaScript]All About
- jQueryのサンプル基本(関数) - javascript
- jQueryのサンプル基本(メソッド) - javascript
- jQueryサンプル集 - DesignWalker
- 51種類のjQueryのチュートリアル&サンプル | DesignWalkerのタネ
- [JS]jQueryのプラグイン33+1選 -2008年1月 | コリス
- ウノウラボ Unoh Labs: 簡単Ajaxライブラリ「jQuery」と便利なプラグインたち
- [JS]jQueryのプラグイン100選 -2008年総集編 | コリス
jQueryのおすすめ書籍
jQueryの使い方を、デザイナーにもプログラマーにも分かるように解説。jQueryプログラミング基礎、イベント処理、アニメーションUIなどをHTMLとJavaScriptのコード、そして画面に解説を加え、丁寧に紹介する(目次)
jQueryの命令を使ったサンプルを数多く盛り込み、の入門書として、jQueryとは? から基本的な命令について、画面とソースコードを示しどのようなことができるかが見て分かる。非同期通信、DOM処理、jQueryプラグインの使い方と作り方なども(目次)
Webデザイナーを対象に、イメージギャラリやアニメーションのサンプルなどを通してDOMによるダイナミックなWebページや視覚効果の方法を実践的に解説する(目次)
DOMの操作によって行えるドキュメント操作、CSSの操作のさまざまなサンプルを集めて解説。イベントやXMLの処理も含みリファレンス的な要素も備えたプログラマ向けの実用的な一冊(目次)