jQuery+jQuery UI+jQuery Mobile逆引きハンドブック目次

jQuery+jQuery UI+jQuery Mobile逆引きハンドブック

【第1部】jQuery

■CHAPTER 01 jQueryの基礎知識

001 jQueryとは?
002 jQueryのバージョンについて
003 jQuery互換ライブラリについて
004 jQueryライブラリの読み込みについて
005 jQueryとDOM (ドキュメントオブジェクトモデル)について

■CHAPTER 02 jQuery Core(コア/基本)

006 jQueryオブジェクトを指定する
007 「$」が他のライブラリと干渉しないようにする

■CHAPTER 03 セレクタ関係

008 すべての要素を指定する
009 ID名で指定する
010 クラス名で指定する
011 属性名で指定する
012 複数の要素を指定する
013 複数の属性セレクタを指定する
014 特定の要素を指定する
015 空の要素を指定する
016 見出し要素を指定する
017 選択された要素を指定する
018 最初の要素を指定する
019 最後の要素を指定する
020 要素の前後関係を指定する
021 指定した出現順番より小さい要素を指定する
022 指定した出現順番より大きい要素を指定する
023 指定した出現位置の要素を指定する
024 偶数番目/奇数番目の要素を指定する
025 親要素を指定する
026 子要素だけを指定する
027 親子関係にある子要素を指定する
028 特定の要素を祖先に持つ要素を指定する
029 特定の子孫要素を持つ要素を指定する
030 指定した順番の子要素を指定する
031 最初の子要素を指定する
032 最後の子要素を指定する
033 兄弟要素を指定する
034 表示されている要素を指定する
035 表示されていない要素を指定する
036 入力が有効になっている要素を指定する
037 入力が無効になっている要素を指定する
038 内容が特定の単語で始まるか「-」で区切られている要素を指定する
039 属性が指定した文字列から始まる要素を指定する
040 属性が指定した文字列で終わる要素を指定する
041 属性が指定した内容になっている要素を指定する
042 属性が指定した内容ではない要素を指定する
043 属性が指定した単語を含む要素を指定する
044 属性が指定した文字列を含む要素を指定する
045 指定した内容が含まれる要素を指定する
046 一致しない要素を指定する
047 チェックボックスを指定する
048 チェック済みのチェックボックスを指定する
049 ボタンを指定する
050 ラジオボタンを指定する
051 リセットボタンを指定する
052 送信ボタンの要素を指定する
053 テキストフィールドを指定する
054 入力フォームのimageを指定する
055 入力フォームのinput要素を指定する
056 ファイルアップロード要素を指定する
057 フォーカスしている要素を指定する
058 アニメーションしている要素を指定する

■CHAPTER 04 属性関係

059 属性値を取得/設定する
060 プロパティを取得/設定する
061 属性を削除する
062 プロパティを削除する
063 値を取得/設定する

■CHAPTER 05 Traversing(トラバース)

064 繰り返し処理を行う
065 要素を検索する
066 要素をフィルタリングする
067 条件にあった場合に処理する
068 要素を配列に変換する
069 処理対象を追加する
070 自身の要素も対象にする
071 最初の要素/最後の要素を取得する
072 指定した要素を持つ場合に処理する
073 指定した要素以外を対象にする
074 指定した位置の要素を指定する
075 親要素を取得する
076 親要素や祖先要素をすべて取得する
077 指定した親要素直前までの親要素を取得する
078 要素から最も近い親要素を取得する
079 特定の「position」属性の親要素を取得する
080 子要素をすべて取得する
081 すべての子要素/テキスト要素を取得する
082 兄弟要素をすべて取得する
083 前の兄弟要素を対象にする
084 前の兄弟要素をすべて対象にする
085 次の兄弟要素を対象にする
086 後の兄弟要素をすべて対象にする
087 指定範囲の兄弟要素を取得する
088 指定した要素より前で特定の条件以外の兄弟要素を対象にする
089 指定した要素より後で特定の条件以外の兄弟要素を対象にする
090 1つ前の要素集合に戻す

■CHAPTER 06 操作

091 要素を複製する
092 要素を切り離す
093 要素を削除する
094 要素の内容を空にする
095 要素を置き換える
096 指定した要素で置き換える
097 要素内に追加する
098 要素の前に挿入する
099 要素の後に挿入する
100 要素の後に追加する
101 要素の前に文字を挿入する
102 要素の後に文字を挿入する
103 各要素の先頭に挿入する
104 セレクタを使って各要素の先頭に挿入する
105 要素の内側に入れ込む
106 要素内の文字列を取得/設定する
107 HTML要素を取得/設定する
108 フォーム関連要素の値を取得/設定する
109 要素の属性値を取得/設定する
110 指定した要素で囲む
111 指定した要素をまとめて囲む
112 囲んでいる要素を消去する

■CHAPTER 07 CSS(スタイルシート)

113 スタイルシートのクラスを追加する
114 スタイルシートクラスを削除する
115 クラスがあるかどうか調べる
116 スタイルシートクラスのON/OFFを切り替える
117 指定したCSSプロパティ値を取得/設定する
118 要素の幅を取得/設定する
119 要素の内側/外側の幅を取得する
120 要素のオフセット位置を取得/設定する
121 親要素からの相対位置を取得する
122 スクロール量を取得/設定する
123 スタイルシートプロパティをフックする(スタイルシートプロパティに処理を追加する)

■CHAPTER 08 イベント関係

124 イベントを設定する
125 1回だけ実行するイベントを設定する
126 要素にイベントを紐付ける(バインドする)
127 要素にイベントを送信する
128 イベントを解除する
129 設定したイベントを解除する
130 イベントハンドラにデータを渡す
131 イベント間でデータを受け渡す
132 オリジナルのイベントオブジェクトを参照する
133 イベントの種類を取得する
134 イベント発生時のキーやボタン番号を取得する
135 イベント発生時の要素を取得する
136 イベント発生時の要素だけを取得する
137 イベント発生前の要素を取得する
138 イベント発生時の時間を取得する
139 イベント発生時の名前空間を取得する
140 イベント発生時のデリゲート要素を取得する
141 ブラウザのデフォルトの動作を禁止する
142 ブラウザのデフォルトの動作を禁止したかどうか調べる
143 イベントの伝達を禁止する
144 イベントの伝達禁止状態を調べる
145 イベントの伝達を完全に禁止したかどうか調べる
146 エラー発生時の処理を行う
147 クリックされた場合に処理する
148 クリックするたびに交互に処理を行う
149 ダブルクリックされた場合に処理する
150 マウスダウン、マウスアップされた場合に処理する
151 マウスオーバー/マウスアウトの場合に処理する
152 マウスが要素の領域内に入った/出た場合に処理する
153 マウス移動時に処理する
154 ホバー(マウスオーバー/アウト)時の処理を行う
155 テキストフィールドの文字が選択された場合に処理する
156 キーが押された/離された場合に処理する
157 フォーカスされた場合に処理する
158 フォーカスを外した場合に処理する
159 内容が変更された場合に処理する
160 送信する前に処理する
161 ページ上の座標を取得する
162 ページが読み込まれた場合に処理する
163 ページや画像の読み込みが完了した場合に処理する
164 ページから離脱する場合に処理する
165 ウィンドウがリサイズされた場合に処理する
166 スクロールした場合に処理する

■CHAPTER 09 エフェクト

167 アニメーションを行う
168 アニメーションを停止する
169 アニメーション効果の処理間隔を指定する
170 アニメーション効果を有効にするか無効にするかを指定する
171 待ち時間を指定する
172 要素の表示/非表示を切り替える
173 要素をアニメーションしながら表示/非表示にする
174 要素をフェードイン/フェードアウトさせる
175 要素を交互にフェードさせながら表示/非表示を切り換える
176 要素をスライドアップ/スライドダウンさせる
177 要素を交互にスライドアップ/スライドダウンさせる
178 キューの取得/設定を行う
179 キューから処理を取り出し実行する
180 キューを消去する

■CHAPTER 10非同期通信

181 非同期通信を使う
182 非同期通信時のオプションを設定する
183 非同期オプションをフィルタリングする
184 GET/POSTメソッドで通信する
185 JSONファイルを読み込む
186 JavaScriptファイルを読み込む
187 サーバー上のファイルを読み込み表示する
188 リクエスト送信時に処理する
189 読み込み開始/終了時に処理する
190 読み込み成功時に処理する
191 読み込み完了時に処理する
192 読み込みエラー時に処理する
193 オブジェクトをシリアライズする
194 フォームデータをシリアライズする
195 jQuery Deferredで非同期処理が完了した時に処理する
196 jQuery Deferredで非同期処理が成功した時に処理する
197 jQuery Deferredで非同期処理が失敗した時に処理する

第11章

198 jQuery Deferredで非同期処理を行う
199 「Deferred」オブジェクトの状態を調べる
200 すべての非同期処理が完了してから処理する
201 成功/失敗に関係なく終了時の処理を行う
202 成功時に処理を行う
203 失敗時に処理を行う
204 成功時と失敗時で処理を分岐させる
205 notifyで通知する/progressで処理する
206 notifyでコンテキストを渡す

第12章

207 ブラウザの種類を調べる
208 サポート状態を調べる
209 オブジェクトの種類を調べる
210 プレーンオブジェクトかどうか調べる
211 オブジェクトが列挙型/空かどうか調べる
212 「Window」オブジェクトかどうか調べる
213 「this」が指し示すオブジェクトを指定する
214 数値かどうか調べる
215 関数かどうか調べる
216 配列かどうか調べる
217 配列に該当要素があるかどうか調べる
218 要素がある要素のノードに含まれているかどうか調べる
219 指定されたノードがXMLノード内にあるか調べる
220 配列に変換する
221 配列要素を処理して新たな配列を生成する
222 2つの配列を連結する
223 配列要素のフィルタ処理を行う
224 要素にデータを保存する
225 要素のデータを削除する
226 文字列の左右の空白や改行を削除する
227 重複していないものを取り出す
228 JSON形式のデータをJavaScriptオブジェクトに変換する
229 XML文字列をXMLオブジェクトに変換する
230 jQueryオブジェクトだけに機能を追加する
231 グローバルコンテキストで式を評価する
232 現在のミリ秒を取得する
233 「ready」イベントを保留する

【第2部】jQuery UI

■CHAPTER 01 インタラクション

234 要素をドラッグ可能にする
235 要素をドロップできるようにする
236 要素をリサイズ可能にする
237 リストを選択できるようにする
238 リストを並び替え(ソート)可能にする

■CHAPTER 02 ウィジェット

239 アコーディオン機能を設定する
240 アコーディオン展開時のアニメーションを禁止する
241 アコーディオンパネルを展開できないようにする
242 アクティブになったパネルのヘッダー情報を取得する
243 パネルヘッダーのアイコンを指定する
244 オートコンプリート機能を設定する
245 入力候補に画像を表示する
246 入力候補の表示位置を指定する
247 入力候補が表示されるまでの時間を設定する
248 入力候補が表示されるポップアップにフォーカスする
249 一定の文字数を入力しないと入力候補が表示されないようにする
250 オートコンプリート機能を削除する
251 グラフィカルなボタンを設定する
252 ボタンを無効にする/有効にする
253 ボタンに表示するアイコンを設定/変更する
254 ボタンに表示する文字を設定/変更する
255 ボタン内の文字を非表示にする
256 カレンダーで選択できるようにする
257 カレンダーをダイアログモードで表示する
258 カレンダーで選択可能な日付範囲を指定する
259 ダイアログを表示する
260 ダイアログの表示位置を指定する
261 ダイアログの幅を設定する
262 ダイアログをドラッグ/リサイズできないようにする
263 ダイアログ生成時に自動的に表示しないようにする
264 ダイアログを閉じる/開かれているか調べる
265 ダイアログが表示された場合に処理する
266 ダイアログがドラッグされた場合に処理する
267 ダイアログがリサイズされた場合に処理する
268 プログレスバーを表示する
269 プログレスバーの最大値を設定する
270 プログレスバーの値を読み出す/設定する
271 プログレスバーの値が更新された/完了した場合に処理する
272 プログレスバーを無効にする/有効にする
273 プログレスバーを破棄する
274 スライダーを表示する
275 範囲スライダーを表示する
276 縦型のスライダーを表示する
277 スライダーの1回の移動量(ステップ)を設定する
278 スライダーを無効にする/有効にする
279 スピナーを設定する
280 スピナーの最小値と最大値を設定する
281 スピナーの増減値を設定する
282 スピナーの生成時に処理する
283 スピナーのイベントを処理する
284 スピナーを破棄する
285 タブ機能を設定する
286 表示したいタブを指定する
287 タブを無効にする/有効にする
288 タブを削除する
289 ツールチップ機能を設定する
290 ツールチップの表示位置を指定する
291 ツールチップの内容を変更する
292 プログラムからツールチップの表示制御を行う
293 セレクトメニューを表示する
294 メニュー項目にカスタムアイコンを表示する
295 セレクトメニューを有効/無効にする
296 選択項目が変化した場合に処理する
297 セレクトメニューのUIを破棄する

■CHAPTER 03 エフェクト

298 ブラインド(blind)エフェクトを行う
299 バウンド(bounce)エフェクトを行う
300 クリップ(clip)エフェクトを行う
301 ドロップ(drop)エフェクトを行う
302 分割(explode)エフェクトを行う
303 フェードイン/フェードアウト(fade)を行う
304 折りたたみ(fold)エフェクトを行う
305 ハイライト(highlight)エフェクトを行う
306 吹きかけ(puff)エフェクトを行う
307 パルス/点滅(pulsate)エフェクトを行う
308 スケール(scale)エフェクトを行う
309 シェイク(shake)エフェクトを行う
310 サイズ変更(size)エフェクトを行う
311 スライド(slide)エフェクトを行う
312 移動(transfer)エフェクトを行う
313 エフェクトを使う
314 エフェクトを使って表示する
315 エフェクトを使って非表示にする
316 エフェクト付きでCSSクラスを追加する
317 エフェクト付きでCSSクラスを削除する
318 エフェクト付きでCSSクラスを切り替える
319 CSSクラスをエフェクト付きで交互に切り替える
320 エフェクト処理を交互に切り替える

【第3部】jQuery Mobile

■CHAPTER 01 ページ構成
321 単ページを構成する
322 複数ページを構成する
323 ヘッダー/フッターを固定する
324 共通のフッターとして使用する
325 全画面(フルスクリーン)モードにする
326 特定のテーマで表示する
327 ヘッダーに戻るボタンを付ける/戻るボタンのテキストを変更する
328 ヘッダーにボタンを追加する
329 フッターにボタンを追加する
330 ナビゲーションバーを表示する

■CHAPTER 02 ダイアロク

331 ダイアログとして表示する
332 ダイアログの表示時のアニメーション方法を指定する
333 ダイアログの閉じるボタンの文字を設定する
334 ダイアログをスクリプトで閉じる

■CHAPTER 03 ページリンク

335 他のページにリンクする
336 ページ移動時のアニメーション方法や移動方向を指定する
337 スクリプトでページを移動させる
338 現在のページを参照する
339 ページ内容をあらかじめ読み込む/キャッシュする
340 スクリプトでページデータをキャッシュする
341 スクリプトでページをスクロールさせる

■CHAPTER 04 リスト/段組/パネル

342 リストを表示する
343 階層化リストにする
344 リストを角丸にする
345 リストを分割して表示する
346 分割リストのアイコンを指定する
347 分割リストのテーマを設定する
348 説明付きのリストにする
349 説明と補足説明付きのリストにする
350 リストに見出し(デバイダ)を設定する
351 リスト項目にカウンタを表示する
352 画像付きのリストにする
353 リスト項目を検索できるようにする
354 段組にする
355 開閉パネルを表示する
356 アコーディオンパネルを表示する

■CHAPTER 05 フォーム

357 テキストフィールドを表示する
358 検索ボックスを表示する
359 電子メール専用のフィールドを表示する
360 電話番号入力用のフィールドを表示する
361 URL入力用のフィールドを表示する
362 スライダーを表示する
363 範囲スライダーを表示する
364 範囲スライダーのハイライトやラベルを消す
365 トグルスイッチを表示する
366 ラジオボタンを表示する
367 チェックボックスを表示する
368 セレクトメニューを表示する
369 送信/リセットボタンを文字サイズに合わせて表示する
370 アイコンとアイコンの表示位置を指定する

■CHAPTER 06 設定/イベント/テーブル/地図

371 デフォルトの設定を変更する
372 jQuery Mobile専用イベントを処理する
373 レスポンシブ対応のテーブル(表組み)を表示する
374 ユーザーがテーブルで表示する列を選択できるようにする
375 ページ全体に地図を表示する

【付録】APPENDIX

376 jQueryプラグインの作成
377 jQuery 2.0.3のコードマップ
378 jQueryメソッド・プロパティ対応バージョン一覧

【コラム一覧】

jQueryのライセンスについて
jQuery/jQuery UI/jQuery Mobileの最新バージョンを確認する
CDNで使われているサーバーの応答速度を調べるには
無名関数を利用して「$」を渡す
「document.getElementsByTagName()」を使ってサンプルと同じ処理を行う
より高速に処理するには
jQueryを使わない場合のコード(多数)
「[属性^=値]」の再実行時の動作について
HTML5で指定できる「type」属性の形式
「[属性=値]」の再実行時の動作について
テーブルで3の倍数の行に色を付ける
アニメーションしている要素を停止させるには
「attr」メソッドと「prop()」メソッドの結果の違い
「removeAttr」メソッドと「removeProp()」メソッドについて
カスタムデータ属性へのアクセス
「closest」メソッドのその他の書式について
jQuery Deferredを使ったアニメーション
「clone()」メソッドについての注意点
古いイベントメソッド
jQueryを使わずに要素のスタイルプロパティの値を取得する
jQueryのイベント設定について
プラグインなどでイベントが重複しないようにする
App Frameworkでの対応
バージョンによるパラメータの違い
jQueryを使わずにフェードアウトさせる
「toggleSlide()」メソッド使用時に 要素が表示されているか非表示かを調べるには
Zepto.js 1.0の場合
jQuery Deferredの解説ペーシ
「this」を固定する
アイコンや画像にSVGを使う
jQueryを使わずにドラッグ可能/ドラッグ禁止にする
アコーディオンパネルをキーボードで操作する
QUnitによるテスト
アイコンだけのボタンにする
jQueryからSVGを操作する
jQuery Mobile 1.4でのボタン設定の変更点
jQuery Mobileのテーマをカスタマイズする

jQuery+jQuery UI+jQuery Mobile逆引きハンドブック

姉妹書のJavaScript逆引きハンドブックもあります。

jQuery+jQuery UI+jQuery Mobile逆引きハンドブック