我总是会有点奇葩的烦恼,如果看这个列子会更加明白
$("#box li:nth-child(1)").css("color", "red");
通俗的理解就是选择box 下面第一个li?后面自己写了一次,发现不对,ppp 下面的每个li 都被选中了
<div id="box">
<ul>
<li>John1</li>
<li>Karl</li>
<li>Brandon</li>
</ul>
<div id="ppp">
<ul>
<li>John2</li>
<li>Karl</li>
<li>Brandon</li>
</ul>
<ul>
<li>Glen3</li>
<li>Tane</li>
<li>Ralph</li>
</ul>
</div>
</div>
:nth-child
概述
匹配其父元素下的第N个子或奇偶元素
':eq(index)' 只匹配一个元素,而这个将为每一个父元素匹配子元素。:nth-child从1开始的,而:eq()是从0算起的!可以使用:<br>nth-child(even)<br>:nth-child(odd)<br>:nth-child(3n)<br>:nth-child(2)<br>:nth-child(3n+1)<br>:nth-child(3n+2)
所以会为每个 li 找到父元素,然后根据是否是第一个li 来展示颜色
jq手册地址: