jQueryチートシート

　いつも同じようなことを調べている気がしたのでまとめました。自分用チートシート。

セレクタの指定方法

表記	意味
$("#hoge")	idがhogeのオブジェクト
$(".hoge")	クラス名がhogeのオブジェクト
$("div")	divタグ
$("div.hoge")	クラス名がhogeのdivタグ
$("p")	pタグ
$("p.hoge")	クラス名がhogeのpタグ
$("*")	すべてのタグ
$("div,span,p")	divタグとspanタグとpタグ
$("div p")	divの子孫のpタグ
$("div>p")	divの子のpタグ（※直接の子タグだけ。孫以下は含まない。）
$("div+p")	divの直後にあるpタグ
$("div", this)	thisの子孫のdivタグ
$("div", $(this).parent())	thisの親の子孫のdivタグ（※同様に、siblings()やprev()などでthisの○○の△△という指定ができる。）

DOM操作

メソッド	意味
html("val")	指定した要素にvalをセットする。（セットした文字列はHTMLとして解釈される。）
text("val")	指定した要素にvalをセットする。（セットした文字列はplain textとして解釈される。）
append("val")	指定した要素にvalを追記する。（追記した文字列はHTMLとして解釈される。）

スタイルシート操作

メソッド	意味
css("color", "red")	指定した要素の文字色を赤に変更する。
css("background-color", "blue")	指定した要素の背景色を青に変更する。
css({ "color" : "red", "background-color" : "blue"});	指定した要素の複数のプロパティを一括変更する。
addClass("hoge")	指定した要素にhogeクラスを追加する。
removeClass("hoge")	指定した要素からhogeクラスを取り除く。
toggleClass("hoge")	指定した要素にhogeクラスがあれば取り除く。無ければ追加する。

イベント処理

メソッド	意味
ready(function(){//処理})	DOMがロードされたときに実行する処理を指定する。
click(function(){//処理})	指定した要素がクリックされたときに実行する処理を指定する。（※ready()内に書くこと。以下のコールバック指定も同様。）
mouseover(function(){//処理})	指定した要素にマウスオーバーしたときに実行する処理を指定する。
mouseout(function(){//処理})	指定した要素にマウスアウトしたときに実行する処理を指定する。
hover(function(){//処理1}, function(){//処理2})	マウスオーバーしたときの処理を処理1に、マウスアウトしたときの処理を処理2に指定する。

非同期通信

メソッド	意味
load("file")	指定した要素にファイルから読み込んだ値をセットする。
jQuery.get("url","data",function(){//処理})	urlにgetで値dataを送信し、帰ってきた内容に対してコールバック関数で設定した処理を適用する。
jQuery.post("url","data",function(){//処理})	urlにpostで値dataを送信し、帰ってきた内容に対してコールバック関数で設定した処理を適用する。