$(this).index()返回的是该节点在兄弟节点中排行第几,从0开始计数
注意是同一父级元素的兄弟节点!!!不能跨级!!!
如:
<tr id="lesson12">
<td>1<br>2</td>
<td class="am_text_middle"><span class="time_check12">0</span></td>
<td class="am_text_middle"><span class="time_check12">1</span></td>
<td class="am_text_middle"><span class="time_check12">2</span></td>
<td class="am_text_middle"><span class="time_check12">3</span></td>
<td class="am_text_middle"><span class="time_check12">4</span></td>
</tr>
$(".time_check12").click(function(){
console.log($(this).index());
})
无论点击以上的哪个span内的元素,控制台打印出来的都是
0
因为在span的父级td下就一个span元素
我最开始错误的想法是:该方法是根据class属性名来确定当前元素的index位置的,换句话说就是有同样的class属性名的节点,无论它是否是兄弟节点,是否有同一个父级,我都从开始往后数它是第几个有这个class属性名的节点那么它的index位置就是相应的值
$(".am_text_middle").click(function(){
console.log($(this).index());
})
点击第一个class属性为am_text_middle的元素,控制台打印出来的值为
1
该元素在td节点内,并且该元素所属的这个td节点在其兄弟节点td中它是排行第2个,所以它的index值就该是1
一开始我非常不明白为什么会是1,不应该是0么,此时我的思想还是根据class属性名来确定当前元素的index位置的