如何使用 jQuery 过滤任何元素的子元素？

在 jQuery 中，可以使用多种方法来过滤任何元素的子元素。以下是一些常用的方法：

1. children

使用 children 方法可以获取当前元素的子元素，可以选择性地指定子元素的选择器。

$(element).children(selector)

例如：

<div id="parent">
  <p>Child 1</p>
  <div class="child">Child 2</div>
  <span class="child">Child 3</span>
</div>

<script>
  $("#parent").children(".child").css("color", "red");
</script>

这段代码将选中 id 为 parent 的元素的所有类名为 child 的子元素，并将它们的文字变为红色。

2. find

使用 find 方法可以获取当前元素下的所有符合选择器的子孙元素。

$(element).find(selector)

例如：

<div id="parent">
  <div class="child1">
    <div class="grandchild">Grandchild 1</div>
  </div>
  <div class="child2">
    <div class="grandchild">Grandchild 2</div>
  </div>
</div>

<script>
  $("#parent").find(".grandchild").css("color", "red");
</script>

这段代码将选中 id 为 parent 的元素下的所有类名为 grandchild 的子孙元素，并将它们的文字变为红色。

3. next

使用 next 方法可以获取当前元素的下一个兄弟元素，可以选择性地指定元素的选择器。

$(element).next(selector)

例如：

<ul>
  <li class="item item1">Item 1</li>
  <li class="item item2">Item 2</li>
  <li class="item item3">Item 3</li>
  <li class="item item4">Item 4</li>
</ul>

<script>
  $(".item1").next(".item").css("color", "red");
</script>

这段代码将选中类名为 item1 的元素的下一个类名为 item 的兄弟元素，并将它的文字变为红色。

4. siblings

使用 siblings 方法可以获取当前元素的所有兄弟元素，可以选择性地指定元素的选择器。

$(element).siblings(selector)

例如：

<ul>
  <li class="item item1">Item 1</li>
  <li class="item item2">Item 2</li>
  <li class="item item3">Item 3</li>
  <li class="item item4">Item 4</li>
</ul>

<script>
  $(".item1").siblings(".item").css("color", "red");
</script>

这段代码将选中类名为 item1 的元素的所有类名为 item 的兄弟元素，并将它们的文字变为红色。

以上就是一些常用的过滤任何元素的子元素的方法，希望对您有所帮助。