jQuery父子选择器

在jQuery中，可以使用父子选择器来选定HTML元素中嵌套关系的特定元素。这个选择器的语法非常简单，主要是用来查找特定父元素下的特定子元素。

语法

父选择器可以用于选定所有特定子元素的祖先元素。

$('parentSelector childSelector')

例如，下面的代码将选定所有<ul>元素中的所有<li>元素：

$('ul li')

子选择器只能用于选定特定的父元素下的特定子元素。

$('parentSelector>childSelector')

例如，下面的代码将选定所有父元素是<ul>元素的直接<li>子元素：

$('ul > li')

示例

HTML代码如下：

<ul>
  <li>列表项 1</li>
  <li>
    列表项 2
    <ul>
      <li>子列表项 1</li>
      <li>子列表项 2</li>
    </ul>
  </li>
  <li>列表项 3</li>
</ul>

选定所有<li>元素：

$('li')

选定所有在<ul>元素中的<li>元素：

$('ul li')

选定所有在嵌套的<ul>元素中的子<li>元素：

$('ul ul > li')

总结

父子选择器是jQuery中非常有用的选择器。它使得选定HTML中嵌套的特定元素变得非常容易。掌握这个选择器可以使你的代码更加优化和高效。