2017-01-31 15 views
2

があります。これは初心者の質問ですが、.each()の利点が普通の$()の選択肢を持っているのは分かりません。 $()はセレクタのすべてのインスタンスを選択し、セレクタに適用されたものをすべて一致するインスタンスに適用します。私の即座の反応は:よく.each()はより複雑なことを可能にしますが、jqueryでチェーンを処理することができるので、通常のセレクタでももっと複雑なことができます。私は5つのp要素を持っている場合たとえば、私が書く:私はちょっと混乱しています.each()には

$("p").css("color","blue");//this would be applied to all five p elements 

$("p").each(function(){$(this).css("color","blue")});//this does the 
                 //same thing 

私は.each()のための使用があると確信している、私は現在、それを見てトラブルを抱えている、通常のセレクタは思わすでにすべてをループに。誰かが私に.each()を使用したい理由の例を教えてもらえますか?

+2

各要素に異なる色を設定する必要がある場合に便利です。 –

答えて

5

次に、各要素の色をdata-color属性に基づいて設定する例を示します。

$("p").each(function(){$(this).css("color", $(this).data("color"))});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<p data-color="red">Red</p> 
 
<p data-color="green">Green</p> 
 
<p data-color="blue">Blue</p>

基本的には、$.each()は、あなたが問題になっている要素へのアクセス権を持つ関数を呼び出すようになります。これにより、前記要素のいくつかのプロパティまたは属性に基づいて機能を呼び出すことができます。

+0

dat one-liner tho – Miro

+1

@Miro個人的には、私は次のようにしたいと思います: '$(" p ")each((i、el)=> $(el).css(" color "、$(el ).data( "color")))); –

+0

Whoa、新しいことを学んだ:) – Miro

関連する問題