jQuery遍歷add方法怎麼用

<p>jQuery 遍歷 add 方法

<p>jQuery 是一個流行的 JavaScript 函式庫，它封裝了許多開發者常用的功能，使得 JavaScript 開發更加簡單和有效率。其中之一就是遍歷 DOM 元素的能力。

<p>在 jQuery 中，可以用多種方式遍歷文件中的元素。其中一種方式是使用 .add() 方法。

什麼是 add 方法

<p>.add() 方法是 jQuery 用來合併兩個或多個集合的方法。它會將一個集合中的元素加入到另一個集合中。新的集合包括原始集合中的所有元素和新的元素。

<p>.add() 方法可以接受多個參數，其中每個參數都是一個 CSS 選擇器、一個 DOM 元素或一組 DOM 元素。這些參數將會被加入到原始集合中。

<p>考慮以下HTML 結構：

<div class="box">
  <p>这里是段落1</p>
</div>
<div class="box">
  <p>这里是段落2</p>
</div>

<p>要選擇所有的<p> 元素和<div> 元素，然後將它們新增到一個新的集合中，可以這樣使用.add() 方法：

var $newCollection = $('p').add('div');

<p>現在，$newCollection 將包含所有<p> 和<div> 元素。

遍歷 DOM 元素

<p>jQuery 遍歷函數傳回 jQuery 對象，包含符合給定選擇器的 DOM 元素。這些函數可以過濾集合、搜尋子元素和尋找符合的 DOM 元素。

<p>以下是最常用的 jQuery 遍歷方法：

• .children()：傳回符合元素的子元素集合。
• .parent()：傳回符合元素的直接父元素。
• .siblings()：傳回符合元素的兄弟元素集合。
• .next()：傳回符合元素的下一個同級元素。
• .prev()：傳回符合元素的上一個同級元素。

<p>這些方法傳回的 DOM 元素集合可以被進一步遍歷或使用其他 jQuery 方法處理。

<p>下面的範例示範如何使用.siblings() 方法來尋找類別名為.red 的所有兄弟元素：

<div class="box">
  <div class="red">红色盒子</div>
  <div>白色盒子1</div>
  <div>白色盒子2</div>
</div>
<div class="box">
  <div class="red">红色盒子2</div>
  <div>白色盒子3</div>
  <div>白色盒子4</div>
</div>

$(document).ready(function() {
  $('.red').siblings().css('background-color', 'gray');
});

<p>這個範例將.red 元素的所有兄弟元素的背景顏色設為灰色。

總結

<p>jQuery 提供了許多遍歷 DOM 元素的方法來方便地操作 HTML 和 CSS。 .add() 方法可以合併兩個或多個元素集合。

<p>以上是 jQuery 遍歷和 .add() 方法的簡短介紹，希望對您有幫助。

以上是jQuery遍歷add方法怎麼用的詳細內容。更多資訊請關注PHP中文網其他相關文章！