jquery第一个子元素

获取 jQuery 第一个子元素的方法

使用 jQuery 选择器可以轻松获取元素的第一个子元素。以下是几种常见的方法：

方法一：使用 :first-child 选择器

$('parentSelector > :first-child')

这会选择指定父元素下的第一个子元素。

方法二：使用 children() 和 first() 方法

$('parentSelector').children().first()

这会先获取所有子元素，然后选择其中的第一个。

方法三：使用 :first 选择器

$('parentSelector > *:first')

这会选择父元素下的第一个任意类型的子元素。

示例代码

假设有以下 HTML 结构：

<ul id="list">
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
</ul>

要获取第一个 <li> 元素：

// 方法一
$('#list > :first-child').css('color', 'red');

// 方法二
$('#list').children().first().css('color', 'red');

// 方法三
$('#list > *:first').css('color', 'red');

注意事项

• 确保父元素存在且包含子元素，否则选择器可能不会返回任何结果。
• 这些方法返回的是 jQuery 对象，可以链式调用其他 jQuery 方法。
• 如果需要原生 DOM 元素，可以使用 get(0) 或 [0] 获取。