Insider.NET > jQuery逆引きリファレンス

連載:
jQuery逆引きリファレンス

山田 祥寛(http://www.wings.msn.to/

第1回 セレクタ編 (2009/10/08)

目的キーワード
id値で要素を特定するには?#id
タグ名で要素を特定するには? 
スタイル・クラスで要素を特定するには?.クラス名
複数のセレクタをまとめて指定するには? 
すべての要素を取得するには?*
ある要素の配下にある要素だけを取得するには?ancestor descendant
ある要素の直下にある要素だけを取得するには?parent > child
指定した要素の次要素を取得するには?previous + next
指定した要素以降の兄弟要素を取得するには?prev ~ next
先頭/末尾の要素だけを取得するには?:first
:last
指定された親要素の先頭/末尾の子要素を取得するには?:first-child
:last-child
偶数/奇数番目の要素だけを取得するには?:even
:odd
指定したインデックス番号(より大きい/未満)の要素を取得するには?:eq(index)
:gt(index)
:lt(index)
指定された要素直下から特定の子要素だけを取得するには?:nth-child
指定したセレクタ以外の要素を取得するには?:not(selector)
配下に特定のテキストを含んだ要素を取得するには?:contains(text)
空要素だけを取得するには?:empty
何らかの子要素を持つ要素を取得するには?:parent
指定した子要素を持つ要素を取得するには?:has(selector)
子要素が1つだけである要素を取得するには?:only-child
属性の値によって取得要素を絞り込むには?[属性名]
複数の属性フィルタを組み合わせるには?[filter][filter]……
フォーム要素やヘッダ要素を取得するには?:input
:headerなど
特定の状態にある要素のみを取得するには?:hidden
:visibleなど

第2回 属性&コンテンツ編 (2009/11/13)

目的キーワード
属性値を取得するには?attr(name)
属性値を設定するには?attr(name, value)
複数の属性値をまとめて設定するには?attr(props)
関数の結果によって動的に属性値を設定するには?attr(name, fnc)
属性値を削除するには?removeAttr(name)
スタイル・クラスを追加/削除するには?addClass(clazz)
removeClass(clazz)
スタイル・クラスが適用されているかを判定するには?hasClass(clazz)
スタイル・クラスの適用/解除を交互に行うには?toggleClass(clazz)
要素に適用されたスタイル情報を取得するには?css(name)
要素に特定のスタイルを適用するには?css(name, value)
複数のスタイル・プロパティをまとめて設定するには?css(props)
要素の表示位置を取得するには?offset()
ページのスクロール位置を取得/設定するには?scrollTop()、scrollLeft()、scrollTop(val)、scrollLeft(val)
要素の高さや幅を取得するには?height()、width()、innerHeight()、innerWidth()、outerHeight()、outerWidth()
要素の高さや幅を設定するには?height(val)、 width(val)
要素のテキストを取得するには?text()、 html()
要素のテキストを設定するには?text(val)、 html(val)
フォーム要素の値を取得/設定するには?val()、 val(val)

第3回 トラバーシング編 (2009/12/21)

目的キーワード
要素セットからn番目の要素を取得するには?eq(index)
要素セットからstart番目〜end番目の要素を取得するには?aslice(start [,end])
要素セットの内容をセレクタ式で絞り込むには?filter(exp)
要素セットからセレクタ式に合致した要素だけを削除するには?not(exp)
要素セットの内容を関数の結果で絞り込むには?filter(fnc)
要素セットに特定条件を含む要素が存在するかを判定するには?is(exp)
要素セットの内容を順番に処理するには?map(func)
要素セットに新たな要素セットを追加するには?add(exp)
要素セットから特定の子孫要素を取り出すには?find()
相対的な位置関係にある要素を取得するには?children([exp])、next([exp])、nextAll([exp])、parent([exp])、parents([exp])、prev([exp])、prevAll([exp])、siblings([exp])
ある要素から最も近い親要素を取得するには?closest([exp])
すべての子要素/テキストを取得するには?contents()
1つ前の要素セットと現在の要素セットを結合するには?andSelf()
1つ前の操作をキャンセルするには?send()
要素セットの先頭/末尾要素を取得するには?first()/last()
配下に特定の要素を持つ要素のみを抽出するには?has(exp|elem)
現在の要素を基点に特定の要素まで兄弟要素を抽出するには?prevUntil([exp])、nextUntil([exp])
現在の要素を基点に特定の親要素に至るまでの要素を抽出するには?parentsUntil([exp])

第4回 要素の操作編 (2010/02/12)

目的キーワード
現在の要素セットに対してコンテンツを追加するには?append(c)、prepend(c)、after(c)、before(c)
現在のコンテンツを指定された要素セットに対して追加するには?appendTo(c)、prependTo(c)、insertBefore(c)、insertAfter(c)
カレント要素を指定した要素で囲むには?wrap(html)、wrapAll(html)、wrapInner(html)
カレント要素を指定された要素で置き換えるには?replaceWith(c)
カレント要素で指定された要素を置き換えるには?replaceAll(exp)
要素セット配下の子要素をまとめて削除するには?empty()
要素セットの内容をまとめて削除するには?remove([exp])
現在の要素セットをコピーするには?clone([flag])
要素セットの内容をまとめて削除するには?(2)detach([exp])
カレント要素をラップしている要素を除去するには?unwrap()

第4回 ユーティリティ編 (2010/02/12)

目的キーワード
ブラウザの互換性にかかわる諸情報を取得するには?$.support[1.3]
配列やオブジェクトの内容を繰り返し処理するには?$.each(obj, fnc)
配列の内容を順に処理し、その結果で新しい配列を生成するには?$.map(ary, fnc)
既存のオブジェクトを拡張するには?$.extend(target, obj [,……])
配列の内容を特定の条件でフィルタするには?$.grep(ary, fnc [,invert])
ある要素が配列内に存在するかを検査するには?$.inArray(val, ary)
配列から重複している要素を除去するには?$.unique(ary)
変数が配列であるかどうかを判定するには?$.isArray(obj)[1.3]
変数が関数であるかどうかを判定するには?$.isFunction(obj)
文字列の前後から空白文字を除去するには?$.trim(str)
DOM要素が別のDOM要素に含まれるかを判定するには?$.contains(container, contains)
空のオブジェクトであるかを判定するには?$.isEmptyObject(obj)
オブジェクトがObjectオブジェクトであるかを判定するには?$.isPlainObject(obj)
空の関数オブジェクトを生成するには?$.noop()
thisキーワードのコンテキストを強制的に変更するには?$.proxy(fnc, context)

第5回 コア編 (2010/03/12)

目的キーワード
セレクタ式で特定の要素セットを取得するには?$(exp [,context])
HTML文字列からjQueryオブジェクトを生成するには?$(html)
標準のDOM ElementオブジェクトをjQueryオブジェクトに変換するには?$(elem)
ドキュメント・ツリーが用意されたタイミングで処理を実行するには?$(fnc)
要素セットの内容を順に処理するには?each(fnc)
要素セットに含まれる要素の数を取得するには?size()/length
要素セットの中のインデックス番号を取得するには?index(elem)
要素セットから特定の要素を取得するには?eq(index)
要素セットから標準の要素オブジェクトを取得するには?get([index])
jQueryオブジェクトを拡張するには?(1)$.extend(obj)
jQueryオブジェクトを拡張するには?(2)$.fn.extend(obj)
jQueryとほかのライブラリを共存させるには?noConflict([flag])
文字列とオブジェクト・リテラルからjQueryオブジェクトを生成するには?$(html ,props)
要素セットを標準の要素オブジェクト配列に変換するには?toArray()

第6回 イベント編 (2010/04/23)

目的キーワード
要素セットにイベント・リスナを設定するには?(1)<event>(fnc)
要素セットに関連付いたイベント・リスナを実行するには?(1)<event>()
ドキュメント・ツリーが用意されたタイミングで処理を実行するには?ready(fnc)
要素セットにイベント・リスナを設定するには?(2)bind(event [,data], fnc)
要素セットに対してまとめてイベント・リスナを設定するには?bind(events)
要素セットに対して一度だけ実行されるイベント・リスナを定義するには?one(event [,data], fnc)
マウス・ポインタが要素に乗った/要素から外れたときの挙動を定義するには?hover(over, out)
クリック時に複数のイベント・リスナを交互に実行するには?toggle(fnc1, fnc2,...)
イベント・リスナの関連付けを破棄するには?unbind([type [,fnc]])
要素セットに関連付いたイベント・リスナを実行するには?(1)trigger(type [,data])
要素セットに関連付いたイベント・リスナを実行するには?(2)triggerHandler(type [,data])
将来的に追加される要素に対してもイベント・リスナを適用するには?live(type,fnc)
イベント・リスナの関連付けを破棄するには?die([type [,fnc]])

第7回 エフェクト編 (2010/05/21)

目的キーワード
非表示状態の要素を表示状態にするには?show([speed [,fnc]])
表示状態の要素を非表示状態にするには?hide([speed [,fnc]])
要素の表示/非表示を交互に切り替えるには?toggle([speed [,fnc]])
要素の表示/非表示を特定の条件で切り替えるには?toggle(switch)
スライドダウン効果を適用するには?slideDown(speed [,fnc])
スライドアップ効果を適用するには?slideUp(speed [,fnc])
スライドアップ/スライドダウンを交互に行うには?slideToggle([speed [,fnc]])
フェードイン効果を適用するには?fadeIn(speed [,fnc])
フェードアウト効果を適用するには?fadeOut(speed [,fnc])
要素の透明度を徐々に変化させるには?fadeTo(speed, opacity [,fnc])
独自のアニメーション効果を適用するには?animate(params [,speed] [,easing] [,fnc])
アニメーション効果を指定順に実行するには?animate(params [,speed] [,easing] [,fnc])
アニメーションの変化の程度を調整するには?animate(params [,speed] [,easing] [,fnc])
アニメーションにかかわるオプションをハッシュ形式で指定するには?animate(params, options)
アニメーションの処理ステップごとに処理を実行するには?animate(params, options)
アニメーションを順次/並行いずれで実行するかを決めるには?animate(params, options)
アニメーションの変化量をスタイル・プロパティの単位に設定するには?animate(params, options) [1.4]
スクリプト全体のアニメーション効果を無効化するには?$.fx.off
アニメーションの途中で処理を休止するには?delay(duration)

第8回 Ajax編(前編) (2010/06/25)

目的キーワード
非同期に読み込んだコンテンツをそのままページに反映させるには? load(url [,data] [,fnc])
非同期に読み込んだコンテンツの一部分だけをページに反映させるには?load(url [,data] [,fnc])
サーバサイド・スクリプトにデータを送信するには?load(url [,data] [,fnc])
サーバサイド・スクリプトにデータを送信するには?load(url [,data] [,fnc])
HTTP GETによる非同期通信を行うには?$.get(url [,data] [,fnc] [,type])
HTTP POSTによる非同期通信を行うには?$.post(url [,data] [,fnc] [,type])
非同期でJSON形式のデータを取得するには?$.getJSON(url [,data] [,fnc])
外部サービスからJSONデータを取得するには?$.getJSON(url [,data] [,fnc])
非同期でJavaScriptのコードを取得するには?$.getScript(url [,fnc])
Ajax通信にかかわるイベント・リスナを登録するには?ajaxStart(fnc)/ajaxStop(fnc)/
ajaxComplete(fnc)/ajaxError(fnc)/
ajaxSend(fnc)

第9回 Ajax編(後編) (2010/07/30)

目的キーワード
Ajax通信を行うには? $.ajax(options)[url、type、dataType、data、success、error]
同期通信/非同期通信のいずれを行うかを選択するには? $.ajax(options)[async]
Ajax通信前に行うべき処理を定義するには? $.ajax(options)[beforeSend]
グローバル・イベントを無効化するには? $.ajax(options)[global]
Internet Explorerによるキャッシングを無効化するには? $.ajax(options)[cache]
サーバ側のコンテンツが更新された場合にのみに処理を実行するには? $.ajax(options)[ifModified]
JSONPで外部サービスのデータを取得するには? $.ajax(options)[dataType、jsonp]
サーバからの応答内容をフィルタ処理するには? $.ajax(options)[dataFilter]
スクリプト共通のAjaxオプションを設定するには? $.ajaxSetup(options)
フォームからの入力値をクエリ文字列に変換するには?serialize()
フォームからの入力値をJSON形式の文字列に変換するには?serializeArray()

第10回 jQuery 1.4編 (2010/08/27)

目的キーワード
DOM要素が別のDOM要素に含まれるかを判定するには?$.contains(container, contains)
空のオブジェクトであるかを判定するには?$.isEmptyObject(obj)
オブジェクトがObjectオブジェクトであるかを判定するには?$.isPlainObject(obj)
空の関数オブジェクトを生成するには?$.noop()
thisキーワードのコンテキストを強制的に変更するには?$.proxy(fnc, context)
アニメーションの途中で処理を休止するには?delay(duration)
要素セットの内容をまとめて削除するには?(2)detach([exp])
カレント要素をラップしている要素を除去するには?unwrap()
要素セットの先頭/末尾要素を取得するには?first()/last()
配下に特定の要素を持つ要素のみを抽出するには?has(exp|elem)
現在の要素を基点に特定の要素まで兄弟要素を抽出するには?prevUntil([exp])、nextUntil([exp])
現在の要素を基点に特定の親要素に至るまでの要素を抽出するには?parentsUntil([exp])
文字列とオブジェクト・リテラルからjQueryオブジェクトを生成するには?$(html ,props)
要素セットを標準の要素オブジェクト配列に変換するには?toArray()
フォームからの入力値をクエリ文字列に変換するには?serialize()
フォームからの入力値をJSON形式の文字列に変換するには?serializeArray()
 

この記事に関連するホワイトペーパー

Focus

- PR -

RSSについて

アイティメディアIDについて

メールマガジン登録

@ITのメールマガジンは、 もちろん、すべて無料です。ぜひメールマガジンをご購読ください。