jQuery API の jQuery . each( collection, callback( indexInArray, valueOfElement ) ) は、collectionに指定した配列もしくはオブジェクトに対し、callback関数を実行する、汎用的イテレータ（繰返し）関数。
引数
- collection
配列もしくはオブジェクト。
- callback( indexInArray, valueOfElement )
すべてのオブジェクトに実行する関数。
- indexInArray
インデックス。
collectionが配列の場合、0から始まるインデックス番号。
- valueOfElement
処理中の値。
戻り値
- Object
オブジェクト。
記述方法
jQuery . each( 配列もしくはオブジェクト, function( index, value ) {
処理
} );
処理
} );
「配列もしくはオブジェクト」に対し、「処理」を実行。
記述例
jQuery . each( [ 'itemA', 'itemB', 'itemC' ], function( index, value ) {
jQuery( '#sample' ) . append( '<p>' + index + ': ' + value + '</p>' );
} );
jQuery( '#sample' ) . append( '<p>' + index + ': ' + value + '</p>' );
} );
idが「sample」である要素内に、
「<p>0: itemA</p>」
「<p>1: itemB</p>」
「<p>2: itemC</p>」
を追加する。
var map = {
'keyA': 'valueA',
'keyB': 'valueB',
'keyC': 'valueC'
};
jQuery . each( map, function( key, value ) {
jQuery( '#sample' ) . append( '<p>' + key + ': ' + value + '</p>' );
} );
'keyA': 'valueA',
'keyB': 'valueB',
'keyC': 'valueC'
};
jQuery . each( map, function( key, value ) {
jQuery( '#sample' ) . append( '<p>' + key + ': ' + value + '</p>' );
} );
idが「sample」である要素内に、
「<p>keyA: valueA</p>」
「<p>keyB: valueB</p>」
「<p>keyC: valueC</p>」
を追加する。
実装例（サンプル）
実装例（サンプル）のソースコード
JavaScript
<script type="text/javascript">
<!--
jQuery( function() {
var map = {
'Red': '赤',
'Blue': '青',
'Green': '緑'
};
jQuery . each( map, function( key, value ) {
jQuery( '#jquery-sample' ) . append( '<li>' + key + ': ' + value + '</li>' );
} );
} );
// -->
</script>
<!--
jQuery( function() {
var map = {
'Red': '赤',
'Blue': '青',
'Green': '緑'
};
jQuery . each( map, function( key, value ) {
jQuery( '#jquery-sample' ) . append( '<li>' + key + ': ' + value + '</li>' );
} );
} );
// -->
</script>
CSS
<style>
<!--
#jquery-sample {
color: #333333;
list-style-type: square;
}
-->
</style>
<!--
#jquery-sample {
color: #333333;
list-style-type: square;
}
-->
</style>
HTML
<ul id="jquery-sample">
</ul>
</ul>