先来一个代码再画个图
代码:
<div>
<p>Hello</p>
<p class="selected">Hello Again</p>
<p><span>And Again</span></p>
<div>
该代码亲戚图为:
本质都是围绕这个亲戚图
siblings():返回所有兄弟姐妹
$("p").siblings().css("background", "yellow");
//若siblings()后面添加参数，例如增加一个".selected"，就是在siblings()返回的基础上再次筛选找class="selected"的<p>标签
//$("p").siblings(".selected").css("background", "yellow");
next():返回后面生出的兄弟姐妹
$("p").next().css("background", "yellow");
//若next()后面添加参数，例如增加一个".selected"，就是在next()返回的基础上再次筛选找class="selected"的<p>标签
//$("p").next(".selected").css("background", "yellow");
.find(selector):直接查找兄弟姐妹
$("p").find("span").css('color','red');
//若是find()不加参数则默认没得查
$(":eq(index)"):跟find一样返回精准查找，但用的是下标，下标从0开始，下标0就是大儿子，下标2就是二儿子…
$("p:eq(0)").css("background-color","yellow");
