eureka_
2016-04-24 00:07
$('.item-2').siblings(':last').css('border', '2px solid blue').为什么只在最后一个div中的最后一个兄弟节点加上了边框,应该是所有div中的最后一个兄弟都加上边框, $('.item-2:last').siblings().css('border', '2px solid blue'),这个应该是在最后一个div中查找所有兄弟节点啊,求解
$('.item-2:last').siblings().css('border', '2px solid blue') 如果这样写你看看明白吗,一开始我也弄混淆了
$('.item-2').siblings()首先是获得除了class为item-2全部的li 然后sibling相当于获取了一个li组成数组 再选择数组中的最后一个 那就是class为item-3的最后一个li
$('.item-2').siblings(':eq(1),:eq(3),:eq(5)').css('border', '2px solid blue');
这样写,就达到你想要的效果了,看到序号了吗?所有的除了class=“item-2”兄弟节点,序号从0开始排序。
:last的意思就是最后一个(【集合的最后一个】)!!!!
siblings(':last')中“:”前代表当前这个选中的“item-2”这个类,相当this,后面代表“item-2”这个类的兄弟
把所有节点放到一个集合里面了。 你试下 这样写 $('.item-2').siblings(':eq(1)').css('border', '2px solid blue') 你就懂了
最后一组的1和3。打错字
:last选择器得到的只能是唯一的一个元素,虽然sibilings()方法看上去得到的是最后一个几个的1和3。但是:last只能取一个元素,所以在1和3之间3才是最后一个元素,因此只去3。
.siblings()得出来的是一个集合,筛选出来的兄弟元素按照0,1,2,3,4...来排列。而不是按照0【div1中所有.item-2的兄弟】,1【div2中所有.item-2的兄弟】来排列。
你用筛选器.siblings(':eq(0)'),.siblings(':eq(1)')....这样试过去就明白的了。
dui 集合的思想
我也有过一样的理解误区,不过后来自己想想明白了,siblings()匹配的是所有兄弟元素,如果说选中的元素只有第一个盒子有的话就是匹配第一个盒子里的兄弟元素的最后一个,而只个例子是被选中元素在三个盒子里都有,所以就会把三个盒子的所有兄弟元素变成一个集合,在按照盒子的前后顺序排列,所以最后一个盒子的最后一个也就是集合的最后一个。说的有点乱,你明白了吗?
:last选择一个过滤和匹配当前jQuery集合在它的最后一个单独的元素。所以就只有一个咯
jQuery基础(二)—DOM篇
114012 学习 · 590 问题
相似问题