分类解析jQuery选择器(3)

$("#div1 > p:last").css("color","red");    //此行代码相当于 $("#div1 > p").last().css("color","red");     <div>       <p>我是第一个P</p>   ***不会被选中,是第一个       <p>我是第二个P</p>   ***不会被选中,是第二个       <p>我是第三个P</p>   ***会被选中,id为#div1下的最后一个P元素     </div>

 (3)、:not(selector)    符合条件但不能被selector选中的元素

$("#div1 > p:not('.p1')").css("color","red");     <div>       <p>我是第一个P</p>        ***会被选中       <p>我是第二个P</p>  ***不会被选中,因为符合了:not里的条件       <p>我是第三个P</p>        ***会被选中     </div>

 (4)、:even      获取指定索引值为偶数的元素(0、2、4、6、8……),注意索引号是从0开始的

$("#div1 > p:even").css("color","red");     <div>       <p>我是第一个P</p>  ***会被选中,索引号0       <p>我是第二个P</p>  ***不会被选中,索引号1       <p>我是第三个P</p>  ***会被选中,索引号2       <p>我是第四个P</p>  ***不会被选中,索引号3       <p>我是第五个P</p>  ***会被选中,索引号4     </div>

 (5)、odd        获取指定索引值为奇数的元素(1、3、5、7、9......),注意索引号是从1开始的

$("#div1 > p:odd").css("color","red");     <div>       <p>我是第一个P</p>  ***不会被选中,索引号0       <p>我是第二个P</p>  ***会被选中,索引号1       <p>我是第三个P</p>  ***不会被选中,索引号2       <p>我是第四个P</p>  ***会被选中,索引号3       <p>我是第五个P</p>  ***不会被选中,索引号4     </div>

(6)、eq(index)      选取指定索引值的元素,索引值从0开始

$("#div1 > p:eq(1)").css("color","red");     <div>       <p>我是第一个P</p>  ***不会被选中,索引号为0       <p>我是第二个P</p>  ***不会被选中,索引号为1       <p>我是第三个P</p>  ***不会被选中,索引号为2       <p>我是第四个P</p>  ***不会被选中,索引号为3     </div>

 (7)、gt(index)      获取所有索引值大于index的元素,索引号从0开始

$("#div1 > p:gt(1)").css("color","red");     <div>       <p>我是第一个P</p>  ***不会被选中,索引号为0       <p>我是第二个P</p>  ***不会被选中,索引号为1       <p>我是第三个P</p>  ***会被选中,索引号为2大于1了       <p>我是第四个P</p>  ***会被选中,索引号为3大于1了     </div>

 (8)、lt(index)      获取所有索引值小于index的元素,索引号从0开始

$("#div1 > p:lt(1)").css("color","red");     <div>       <p>我是第一个P</p>  ***会被选中,索引号为0,小于1       <p>我是第二个P</p>  ***不会被选中,索引号为1,不小于1       <p>我是第三个P</p>  ***不会被选中,索引号为2大于1了       <p>我是第四个P</p>  ***不会被选中,索引号为3大于1了     </div>

(9)、:header       索取所有标题类型元素h1、h2、h3、h4、h5、h6

$("#div1 > :header").css("color","red");     <div>       <p>我是一个P</p>      ***不会被选中,不是标题类型元素       <span>我是一个span</span> ***不会被选中,不是标题类型元素       <h1>我是一个h1</h1>    ***会被选中,h1是标题类型元素       <h6>我是一个h6</h6>    ***会被选中,h6是标题类型元素     </div>

(10)、animated    正在执行动画效果的元素

4、内容过滤选择器

  (1)、:contains(text)    获取包含给定文本的元素

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wzzgws.html