webサイト制作の勉強|2023年11月クラス用ブログ

ファリカテクニカルアカデミーのwebサイト制作科の授業解説ブログです。フェリカテクニカルアカデミーは池袋にある求職者支援訓練の学校です。

jQueryでのeach()メソッド

jQueryで複数のオブジェクトに対して繰り返し処理を行う場合は、each() メソッドを使用します。

まとめて処理されるパターン

<ul>
<li>リスト1</li>
<li>リスト2</li>
<li>リスト3</li>
</ul>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js'></script>
<script>
$(function(){
alert($('li').text());
});
</script>
jQuery.each() の使い方

複数あるli要素に対して1回1回繰り返しを行う場合は、以下のように記述します。

<ul>
<li>リスト1</li>
<li>リスト2</li>
<li>リスト3</li>
</ul>



<script>
$(function(){
 $('li').each(function(){
        alert($(this).text());
    }); 
});
</script>