<div id="menu">
<!--tag标题-->
<div id="menu_female">
<h3>女装</h3>
<div class="tag" style="display: block;">
<dl>
<dd>
<p>第一类</p>
<a>1.衬衫</a>
<a>2.T恤</a>
<a>3.雪纺衫</a>
<a>4.针织衫</a>
<a>5.短外套</a>
<a>6.卫衣</a>
<a>7.小西裤</a>
<a>8.风衣</a>
<a>9.吊带背心</a>
<a>10.连衣裙</a>
<a name="setColor">11.蕾丝连衣裙</a>
<a>12.复古连衣裙</a>
<a>13.印花连衣裙</a>
<a>14.真丝连衣裙</a>
<a>更多</a>
</dd>
</dl>
</div>
</div>
<script type="text/javascript">
//不分男女,选中第一类衣服中第9个a元素,并改变颜色
//这里用了nth-child 选择的他们所有父元素的第n个子元素
$("#menu dd a:nth-child(9)").css('color','#66CD00');
</script>
看图应该可以
nth-child()这个功能有点迷,比如a:nth-child(3),他会找到a所在父元素,然后再找该父元素下所有的标签(包含其他标签),定位到第3个,如果是a标签,就会生效(如果你写了p,就不会生效)。并不是找到父元素下面的第3个a标。
$("#menu dd a:nth-child(9)")指的时dd的所有子标签第九个 并且为a标签
所以要选中9的话 需要加1 因为P标签和a标签同级 所以P标签页算进去了
为$("#menu dd a:nth-child(10)")第10个元素 但是是a标签的第九个
我也是这样,同问
nth-child(index) 的index下标是从 0 开始的