0017

jQueryの.eachの使い方

jQueryの.eachの使い方

2011.8.6

jQueryの.eachの使い方に関して、個人的な理解の方法としてメモしておきます。

基本的な考え方

  1. 処理をしたい要素の親要素を.eachで取得する。
  2. 取得した要素の子要素に対して処理を施す

サンプル

下記コードは、ulとolのliに対して縞模様(odd,even)クラスを割り当てます。
上記の説明で例えると、親要素はulやol、子要素はliになります。

jQuery('ul, ol').each(function(){
    //JSでは0から数えるのでevenとaddを逆に指定
    jQuery(this).children('li:odd').addClass('even');
    jQuery(this).children('li:even').addClass('odd');
});

dlに対するdtやdd、trに対するthやtdも同じ関係ですね。