HOME > > > > >

.eq()

.eq( index )

.eq( -index )

引数

(int)index

戻り値

jQuery
jQueryオブジェクト

jQueryオブジェクトにセットされているDOM要素からindex番目のDOM要素がセットされたjQueryオブジェクトを取得する。 .index()、.get()がDOM要素そのものを返すのに対しこちらはjQueryオブジェクトを返す。

index番号は0から始まり、負の値を指定すると末尾からのカウントしていく。

サンプル

実行結果

画像1 画像2 画像3 画像4
実行

Javascript

  1. let photos = $('#sample-1 .photo').css({
  2.     margin: 5,
  3.     padding: 10,
  4.     border: '1px solid #CDCDCD',
  5.     display: 'inline-block'
  6. });
  7.  
  8. $('#execute-1').on('click', function(){
  9.     alert(photos.eq($(this).data('target')).attr('alt'));
  10. });

HTML

  1. <div id="sample-1">
  2.   <div class="photos">
  3.     <img src="/resource/images/photos/1.jpg" class="photo" alt="画像1" style="width: 20%;">
  4.     <img src="/resource/images/photos/2.jpg" class="photo" alt="画像2" style="width: 20%;">
  5.     <img src="/resource/images/photos/3.jpg" class="photo" alt="画像3" style="width: 20%;">
  6.     <img src="/resource/images/photos/4.jpg" class="photo" alt="画像4" style="width: 20%;">
  7.   </div>
  8.   <span class="cq-btn m-primary" id="execute-1" data-target="2">実行</span>
  9. </div>