jQuery .prev() と.next()の使い方

nissy 26views 更新:2016年10月9日

以下のような、DOM要素があったとき、

<ul>
  <li>list item 1</li>
  <li>list item 2</li>
  <li class="third-item">list item 3</li>
  <li>list item 4</li>
  <li>list item 5</li>
</ul>

prev()とnext()で以下のような部分のDOM要素の選択をすることができます。

//.prev()の場合 item2の背景色が赤に変わります
$('li.third-item').prev().css('background-color', 'red')

//.next()の場合 item4の背景色が赤に変わります
$('li.third-item').next().css('background-color', 'red')

ログイン / 新規登録してコメントする

このソースコードをストックして後で利用したり、作業に利用したソースコードをまとめることができます。

こちらもお役に立つかもしれません