jquery的遍历
jQuery 遍历方法概述
jQuery 提供多种遍历 DOM 元素的方法，允许开发者高效地查找、筛选和操作元素。以下是常见的遍历方法分类及说明：
祖先遍历
parent()
返回被选元素的直接父元素。
$('span').parent(); // 获取所有 <span> 的直接父元素parents()
返回被选元素的所有祖先元素（直到 <html>）。
$('span').parents(); // 获取所有 <span> 的所有祖先parentsUntil()
返回被选元素与指定元素之间的所有祖先。
$('span').parentsUntil('div'); // 获取从 <span> 到 <div> 之间的祖先后代遍历
children()
返回被选元素的所有直接子元素（仅一层）。
$('div').children(); // 获取 <div> 的直接子元素find()
返回被选元素的所有后代元素（匹配选择器）。
$('div').find('span'); // 获取 <div> 下的所有 <span>兄弟遍历
siblings()
返回被选元素的所有兄弟元素。
$('li').siblings(); // 获取所有 <li> 的兄弟元素next()
返回被选元素的下一个兄弟元素。
$('li').next(); // 获取 <li> 的下一个兄弟nextAll()
返回被选元素之后的所有兄弟元素。
$('li').nextAll(); // 获取 <li> 之后的所有兄弟nextUntil()
返回被选元素与指定元素之间的所有兄弟元素。
$('li').nextUntil('p'); // 获取从 <li> 到 <p> 之间的兄弟prev()
返回被选元素的上一个兄弟元素。
$('li').prev(); // 获取 <li> 的上一个兄弟prevAll() / prevUntil()
功能类似 nextAll() 和 nextUntil()，方向相反。
过滤遍历
first()
返回被选元素的第一个元素。
$('li').first(); // 获取第一个 <li>last()
返回被选元素的最后一个元素。
$('li').last(); // 获取最后一个 <li>eq()
返回被选元素中指定索引的元素（从 0 开始）。
$('li').eq(2); // 获取第三个 <li>filter()
返回匹配指定条件的元素。
$('li').filter('.active'); // 获取 class 为 "active" 的 <li>not()
返回不匹配指定条件的元素。
$('li').not('.hidden'); // 获取 class 不为 "hidden" 的 <li>链式调用示例
jQuery 遍历方法支持链式调用，可组合多个操作：
$('ul')
.find('li')
.eq(1)
.css('color', 'red'); // 将第二个 <li> 文字颜色设为红色注意事项
- 遍历方法返回的是 jQuery 对象，可继续调用其他方法。
- 使用
find()时需传入有效的选择器，否则返回空集合。 - 过滤方法（如
eq()）的索引从 0 开始。
通过灵活组合这些方法，可以高效实现复杂的 DOM 操作需求。
