jQuery DOM Traversal - 過濾方法

特定方法過濾出元素。

first()

在集合內，選取第一個元素。

範例

HTML

<ul id="List">
  <li>List Item 1</li>
  <li>List Item 2</li>
  <li>List Item 3</li>
  <li>List Item 4</li>
  <li>List Item 5</li>
</ul>

JavaScript

$('#List li').first().css('background-color', 'pink');

last()

在集合內，選取最後一個元素。

範例

HTML

<ul id="List">
  <li>List Item 1</li>
  <li>List Item 2</li>
  <li>List Item 3</li>
  <li>List Item 4</li>
  <li>List Item 5</li>
</ul>

JavaScript

$('#List li').last().css('background-color', 'pink');

eq()

在集合內，依索引位置選取指定的元素。

eq(index)

參數

功能	說明	型別	範例	備註
index	索引位置	Number	0	必填

範例

HTML

<ul id="List">
  <li>List Item 1</li>
  <li>List Item 2</li>
  <li>List Item 3</li>
  <li>List Item 4</li>
  <li>List Item 5</li>
</ul>

JavaScript

$('#List li').eq(3).css('background-color', 'pink');

filter()

過濾出指定的元素。

filter(selector)

參數

功能	說明	型別	範例	備註
selector	選取器	String	':even'	必填

範例

HTML

<ul id="List">
  <li>List Item 1</li>
  <li>List Item 2</li>
  <li>List Item 3</li>
  <li>List Item 4</li>
  <li>List Item 5</li>
</ul>

JavaScript

$('#List li').filter(':odd').css('background-color', 'pink');