本节主要讲jQuery的元素遍历的方法，每个重点都配备案例，写笔记不易，希望大家多多支持，多多关注！亲爱的号友们，互粉哈，本机最后有福利啊！
jQuery遍历之children()方法
.children(selector) 方法是返回匹配元素集合中每个元素的所有子元素（仅儿子辈，这里可以理解为就是父亲-儿子的关系）
$("div").children()通过在DOM树中对这些元素的直接子元素进行搜索，并且构造一个新的匹配元素的jQuery对象
$("div").children(".selected") 方法选择性地接受同一类型选择器表达式
例： $(".div").children().css('border','1px solid red')
$('.div').children(':last').css('border', '3px solid blue')
jQuery遍历之find()方法
.find()快速查找DOM树中的这些元素的后代元素 children是父子关系查找，find是后代关系（包含父子关系）
$(".left").find("li:last").css('border','1px solid red')
jQuery遍历之parent()方法
.parent()查找父元素 只查找一级
例： $(".level-3").parent().css('border','1px solid red');//查找.level-3的父元素
$('.item-a').parent(':last').css('border', '1px solid blue') //找到所有.item-a的父元素（.item-a不止
一个）选择最后一个
jQuery遍历之parents()方法
.parents() 查找合集里面的每一个元素的所有祖辈元素
parents()方法也可选择性地接受同一型选择器表达式
1、 .parents()和.parent()方法是相似的，但后者只是进行了一个单级的DOM树查找
2、$( "html" ).parent()方法返回一个包含document的集合，而$( "html" ).parents()返回一个空集合。（html文档中的根元素，所有是空）
例： $(".item-b").parents().css('border','1px solid red') 选取全部父元素
$('.item-b').parents('.first-div').css('border', '2px solid blue') 选取父元素class="first-div"的
jQuery遍历之closest()方法
closest()方法接受一个匹配元素的选择器字符串 ，从元素本身开始，在DOM 树上逐级向上级元素匹配，并返回最先匹配的祖先元素。$("div").closet("li') 表示在div元素中 往上查找所有的li元素
.parents()和.closest()区别：
1、起始位置不同：.closest开始于当前元素 .parents开始于父元素
2、遍历的目标不同：.closest要找到指定的目标，.parents遍历到文档根元素，closest向上查找，直到找到一个匹配的就停止查找，parents一直查找到根元素，并将匹配的元素加入集合
3、结果不同：.closest返回的是包含零个或一个元素的jquery对象，parents返回的是包含零个或一个或多个元素的jquery对象
例：$(".item-1").closest(".level-2").css('border','1px solid red')
jQuery遍历之next()方法
.next()查找指定元素集合中每一个元素紧邻的后面同辈元素的元素集合
next()无参数允许我们找遍元素集合中紧跟着这些元素的直接兄弟元素，并根据匹配的元素创建一个新的 jQuery 对象，也可以选择性地接，同一类型选择器表达式。
例：$(".item-2").next().css("border",'1px solid red')
$('.item-2').next(':first').css('border', '1px solid blue')//选出item-2下的第一个兄弟元素
等同于： $('.item-2').find(':eq(1)').css('border','1px solid red');
jQuery遍历之prev()方法
.prev()查找指定元素集合中每一个元素紧邻的前面同辈元素的元素集合(同辈)，也可以选择性地接受同一类型选择器表达式
例：$(".item-2").prev().css('border','1px solid red')
$('.item-3').prev(':last').css('border', '1px solid blue')//找到item-3最后一个元素的兄弟节点（.item-3可能存在多个，所以选择最后一个）
jQuery遍历之siblings()
.siblings()查找指定元素集合中每一个元素的同辈元素,也可以选择性地接受同一类型选择器表达式
例： $(".item-2").siblings().css('border','1px solid red')
$('.item-2').siblings(':last').css('border', '2px solid blue')//筛选最后一个兄弟节点
jQuery遍历之add()方法
add() 将元素添加到匹配的元素集合中
处理一：传递选择器 $('li').add('p') 先选择li ，再加上p。组成一个合集；
处理二：传递dom元素 $('li').add(document.getElementsByTagName('p')[0])
处理三：动态创建P标签 $('li').add('<p>新的p元素</p>').appendTo(目标位置)
例：$('li').add('p').css('background', 'red')//既选择li又选择p 都加上红色背景
$('li').add('<p>新的p元素</p>').appendTo($('.right')) //既选择li又新创建p 都追加到.right里边
jQuery遍历之each()
.each() 方法就是一个for循环的迭代器，它会迭代jQuery对象合集中的每一个DOM元素。每次回调函数执行时，会传递当前循环次数作为参数(从0开始计数
1、each是一个for循环的包装迭代器
2、each通过回调的方式处理，并且会有2个固定的实参，索引与元素
3、each回调方法中的this指向当前迭代的dom元素
例：<ul>
<li>百度</li>
<li>谷歌</li>
</ul>
$("li").each(function(index, element) {
index 索引 0,1
element是对应的li节点 li,li
this 指向的是li
})
如果需要提前退出，可以以通过返回 false以便在回调函数内中止循
例：$("li").each(function(index, element) {
$(this).css('color','red')
})//遍历所有li
至此所有的jQuery的dom操作教程算是学完了，学到现在，基本的jquery小特效应该都可以自己去写了！后续仍有笔记，大家关注我，我会每天发布学习笔记的！粉我必粉！
学累了，福利来一波