一、jQuery父级以及同级元素查找
1、获取父节点
注意与parents的区别,parents()从自身的父节点开始向上遍历,返回所有祖先节点,并根据选择器对这些节点进行筛选,最终返回的jQuery对象可能包含0、1或者多个对象 ,而parent它只向上搜索一层。
closest()从自身开始向上遍历,直到找到一个适合的节点(一般只找到与其临近的父级节点),返回的jQuery对象包含0个或者1个对象;
2、兄弟节点 siblings /next (都是往下获取节点)
$(function(){
$('.one').siblings().css({background:'red'})
// $('.one').next().css({background:'red'}) //next只返回一个节点,即下一个
// $('.one').nextAll().css({background:'red'}) //nextAll返回所有之后的兄弟节点,在nextAll()里可以进行传参 ,进行过滤。
// $('.one').nextUntil('.b').css({background:'green'}) //可传参亦可不传参,若传参直到哪一个终止,不包括传参的那个值
// $('li').css({background:'orange'}).filter('.b').css({background:'pink'})
// $('li').not('.b').css({background:'pink'})
})
<ul>
<li class="one"></li>
<li class="b"></li>
<li></li>
往前获取节点:prev(),返回上一个兄弟节点,不是所有的兄弟节点,而prevAll()返回所有之前的兄弟节点
3、获取子节点
children() 返回所有子节点,该方法只返回直接的孩子节点,不会返回所有的子孙节点。如果我们没有应用选择器表达式,返回的 jQuery 对象包含了所有子元素。如果应用一个选择器的话,那么只会包括匹配的项目。
fin的()是遍历当前元素集合中每个元素的后代。只要符合,不管是儿子辈,孙子辈都可以;与其他的树遍历方法不同,选择器表达式对于 .find() 是必需的参数。如果我们需要实现对所有后代元素的取回,可以传递通配选择器 '*'。find只在后代中遍历,不包括自己。