「jQuery系列」关于jQuery遍历的那些事儿

在jQuery中，我们可以使用多种方法来遍历DOM元素。以下是一些常用的方法：

1. children(): 获取元素的直接子元素。
2. find(): 获取元素的后代元素。
3. siblings(): 获取元素的同级兄弟元素。
4. parent(): 获取元素的父元素。
5. eq(): 获取指定索引的元素。
6. first(): 获取第一个元素。
7. last(): 获取最后一个元素。

示例代码：

// 假设我们有以下HTML结构
// <div id="parent">
//   <div class="child">Child 1</div>
//   <div class="child">Child 2</div>
//   <div class="child">Child 3</div>
// </div>
 
$(document).ready(function() {
    // 获取id为'parent'的直接子元素
    $('#parent').children().css('border', '2px solid red');
 
    // 获取class为'child'的所有元素
    $('#parent').find('.child').css('background-color', 'yellow');
 
    // 获取class为'child'的同级兄弟元素
    $('.child').siblings().css('text-decoration', 'line-through');
 
    // 获取class为'child'的父元素
    $('.child').parent().css('font-weight', 'bold');
 
    // 获取class为'child'的第一个元素
    $('.child').eq(0).css('color', 'green');
 
    // 获取class为'child'的最后一个元素
    $('.child').last().css('font-style', 'italic');
});

这段代码在文档加载完成后，会改变一些元素的样式，以便更明显地展示它们是如何被遍历和选中的。