children()用于获取匹配元素的直接子元素,仅限一级子元素。语法为$(selector).children(filter),filter可选,用于筛选如类名、标签名等。例如$('#parent').children()返回所有直接子元素,而$('#parent').children('li')只返回li元素。与find()不同,children()不查找深层后代,find()可深入多级。该方法适用于精确控制DOM层级的操作场景。

在jQuery中,children() 方法用于获取匹配元素的直接子元素。它只返回一级子元素,不会深入到更深层的后代元素。
基本语法
$(selector).children(filter)参数说明:
- filter(可选):可以是一个jQuery选择器表达式,用来进一步筛选所需的子元素。例如类名、标签名或属性等。
常见用法示例
1. 获取所有直接子元素
假设HTML结构如下:
- 第一项
- 第二项
一个span
使用 children() 获取 ul 下的所有直接子元素:
$('#parent').children();这将返回三个子元素:两个 li 和一个 span。
2. 带筛选条件的子元素查找
如果只想获取 li 元素:
此时只会选中两个 li 元素。
也可以通过类名来筛选:
$('#parent').children('.item1');这样只返回 class 为 item1 的那个 li。
children() 与 find() 的区别
children() 只查找直接子元素(一级),而 find() 会查找所有后代元素(多级)。
例如:
段落1
嵌套的span
执行:
$('.container').children()只会得到 p 和 div 这两个直接子元素;
而:
可以找到内部的 span,因为 find 能深入多层。
基本上就这些。children() 是一个简单高效的方法,适合需要精确控制层级的DOM操作场景。










