一つや2つではない。全部だ。
each
こいつもループ処理の一種ですが
要素のループなどでも使える便利なものです。
要素のループ
指定セレクタが複数ある場合、それらをループして処理させる事ができます。
例えばリストが存在していて、.addOkが付与されているもののみに対してクラスを付与したい場合は
以下の様な記述方法となります。
この条件ならセレクタでやれって話ですが、使い方の例ですのでご容赦ください(;´Д`)
$('ul li').each(function() { if($(this).hasClass('addOk')) { $(this).addClass('on'); } });
配列・オブジェクトのループ
配列やオブジェクトのループも行う事ができます。
またループ中のkeyやvalue値も取得することができます。
要素と違って、セレクタの指定ではありませんので、若干記述方法が異なります。
eachの第一引数にループ処理させたい配列/オブジェクトを
eachの第二引数にループ実行処理を記述します。
またループ実行の引数を指定することができます。
第一引数はkey値
第二引数はvalue値
がそれぞれ代入され使用することができます。
以下の例ではkeyとvalueと命名していますが、これに限らず好きな名前をつけることもできます。
var array = {'ああああ':'ううううう','いいいいい':'ええええええ'}; $.each(array,function(key,value) { console.log(key); console.log(value); });
二次元とか三次元配列とか
上記では1次元配列でしたが二次元三次元など広がった場合はどうでしょうか。
each内eachを行うことでループ処理を実行させる事が可能です。
複数のeach処理を内包する場合、keyとvalueの変数名には注意しましょう。
理由は・・・分かりますか?(*゚∀゚)
var array = { 'ああああ':'ううううう', 'いいいいい':'ええええええ', 'aaa': { 'aaaa':'uuuu', 'iiiii':'eeeee', '11111': { '1111':'2222', '3333':'4444' } } }; $.each(array,function(key,value) { console.log(key); console.log(value); if(key == 'aaa') { $.each(value,function(key2,value2) { console.log(key2); console.log(value2); if(key2 == '11111') { $.each(value2,function(key3,value3) { console.log(key3); console.log(value3); }); } }); } });