jQuery add() 方法

jQuery 中的add()方法用於向匹配元素集合新增元素，從而擴充套件選擇範圍。

此方法接受兩個引數：“element”和“context”。如果我們沒有指定context引數，則add()方法會在整個文件中向選擇新增元素。如果提供了context引數，則add()方法只在指定的context元素內新增元素。

語法

以下是jQuery中jQuery add()方法的語法：

$(selector).add(element,context)

引數

此方法接受以下引數：

element: 它可以是選擇器表示式、jQuery物件、一個或多個元素或要新增到現有元素組的HTML片段。
context（可選）：指定選擇器表示式應開始匹配的文件中的位置。

示例 1

下面的例子選擇標題(<h2>) 並向其中新增元素<p>和<div>，使它們的背景顏色變為黃色：

<html>
<head>
  <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
  <script>
    $(document).ready(function(){
      $('h2').add('p').add('div').css('background-color', 'yellow');
    });
  </script>
</head>
<body>
<h2>Welcome to Clubhouse</h2>
<p>I'm Goofy.</p>
<p>I'm Mickey Mouse.</p>
<div>I'm Daisy Duck.</div>
<span>I'm Minnie Mouse.</span>
</body>
</html>

當我們執行上面的程式時，它會為<h2>、<p>和<div>元素新增黃色背景顏色，但不會為<span>元素新增。

示例 2

下面的例子為第二個span元素（索引為1）新增css樣式(background-color: yellow)，如同現有的p元素一樣：

<html>
<head>
  <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
  <script>
    $(document).ready(function(){
      // Select all list items and add class 'highlight' to them
      $('p').add(document.getElementsByTagName("span")[1]).css('background-color', 'yellow');
    });
  </script>
</head>
<body>
<p>I'm Goofy.</p>
<p>I'm Mickey Mouse.</p>
<span>I'm Minnie Mouse.</span><span>I'm Daisy Duck.</span>
</body>
</html>

當我們執行上面的程式時，它會為“p”和第二個“span”元素新增background-color: yellow。

jquery_ref_traversing.htm

列印頁面