2月 16, 2010
jQueryを勉強しようvol.2「jQueryのセレクタと記述方式」
第一回目は「jQueryを勉強しようvol.1「jQueryのraedy関数について」」というエントリーで
基本的な命令の出し方を学びましたが、今回はjQueryを使った時に、
HTML側の要素を指定する方法につてまとめました。
セレクタと記述方式
要素を指定するにはセレクターを指定する必要があります。
セレクタの指定形式は下記の通り
$(function(){
$("セレクタ名").jQueryの命令部分
});
とセレクタ名を指定しておいて、ドットで区切り、
命令を記述します。jQueryの場合ほぼ全ての形式が上記の形で
書く事になりますので、この構造を覚えておきましょう。
具体的なセレクタ
上記コードの「セレクタ名」と書かれている所には何が入るのか？
下記のコードだとliという要素に対して、CSSのcolorプロパティを
赤に変更せよという形になります。
$(function(){
$("li").css("color","red");
});
もちろん要素だけではなくて、CSSと同じような感覚ID名、クラス名、
子要素のみだったり、グループだったり、jQuery独自のフィルターなど、
様々な範囲のセレクタ指定方法が準備されておりセレクタの指定の方法は多数あります。
海外版にはなりますが、セレクタのチートシートが便利ですので
セレクタ一覧が見たいと言う方は「jQuery Selectors | Refcardz」をどうぞ。
セレクタに関する役立ちそうなエントリー
jQuery を高速に使う CSS セレクタの書き方 – てっく煮ブログ
jQueryのセレクタ 基本 – ［JavaScript］All About
jQueryのセレクタを徹底マスターするのに最適！『jQuery Selectors』 – IDEA*IDEA ～ 百式管理人のライフハックブログ
No Comments, Comment or Ping
Reply to “jQueryを勉強しようvol.2「jQueryのセレクタと記述方式」”