F2E

jQuery 7種 在父子、兄弟關係元素間穿梭（prev、prevAll、next、nextAll、siblings、parent、end、children）2種 改變目標對象（end、andSelf）

以現存元素為基準點取得另外的元素

.prev() 前面最親近的兄弟

.prevAll() 所有兄元素

.next() 後面最親近的兄弟

.nextAll() 所有弟元素

.siblings() 所有兄弟元素

.parent() 父元素

.children() 所有子元素

這邊直接附上codepen，直接看code會相對理解的快

改變 jQuery 物件的目標對象

.end() 讓 jQuery 回復到原先狀態

1
2
3
4
5
6
7
$(function() {
  $('#me')
  .css('font-weight', 'bold')
  .prev() // jQuery 指到 <div>姊姊（兄元素）</div>
  .css('background-color', 'pink')
  .end()  // jQuery 指回 $('#me')
})
1
2
3
4
5
6
7
8
<div>姊姊（兄元素）</div>
<div id="me">
  我（目前元素）
  <div>
    小不點（子元素）
      <div>寵物（孫元素）</div>
  </div>
</div>

.andSelf() 在目前的狀態上新增前一個狀態

這邊直接附上w3school代碼連結（在codepen上寫範例一直失敗😭）