Rails3.1のjavascriptライブラリはjQueryに移行する
prototype.jsからjQuery
インターフェイス実装の大変革が起こる
jQueryのおおきな特徴
1.セレクタ
2.イベント
エフェクト
アニメーション
ajax
3.Deffer
プラグイン
coffeescriptでjQueryを書ける
$("li[id='1']").css "color", "red"
という風に書く。
jQueryだと
$("li[id='1']").css("color", "red");
DOMをオブジェクトに包んで返す
(CSSの書き方を踏襲している)
liとかの場合、DOM要素を配列オブジェクトにして返している。
なので、"li[id='1']"みたいな書き方になる(キーからアクセスしている)。
$("li").css "color", "red"
とすると、li全てが赤になる。
偶数飛ばし
$("li:even").css "color", "red"
奇数飛ばし
$("li:odd").css "color", "red"
jQueryの日本語レファレンスが余裕で使える
セレクタ+スペースで、木構造の子孫にアクセス出来る
$("li gt(1)").css "color", "red"
gt(1) より大きい要素のときだけ実行する
#("se_area).html "<input type='button' value='click!' id='x' />"
clickやmouseoverだとかのイベントハンドラを再定義するのがjQueryである。
$("#x").click () -> $("li[id='2']").css "color", "red"
みたいな書きかたが出来る
$("#x").click () -> alert 'OK' $("#x").unbind () $("#x").click () -> $("li[id='2']").css "color", "red"
不要になったイベントハンドラをunbindで解除できる
Deffer
Defferを使うことで、onloadのタイミングをコントロールできる
まとめ
jQueryはJavascriptの弱点を克服する
フロントエンドに特化
インターフェイス開発に余裕