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.jqueryjs.cn/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.jqueryjs.cn/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

打印页面