您的位置:首页 > Web前端 > JQuery

jquery子元素过滤选择器:nth-child、:first-child、:last-child、:only-child

2017-08-28 10:25 441 查看
全栈工程师开发手册 (作者:栾鹏)

jquery系列教程1-选择器全解

jquery子元素过滤选择器

jquery子元素过滤选择器,包括:nth-child、:first-child、:last-child、:only-child,具体功能如代码中注释。

通过冒号前加空格实现。和基本过滤器的区别:基本过滤器冒号前没有空格,基本过滤器对元素进行操作,获取元素列表,此处的过滤器对父元素进行操作,获取子元素列表

代码如下:

$("div :nth-child(2)");         //获取每个div下的第2个子元素,索引从1开始
$("div :nth-child(even)");      //获取每个div下的索引为偶数的子元素,索引从1开始
$("div :nth-child(odd)");       //获取每个div下的索引为奇数的子元素,索引从1开始
$("div :nth-child(3n+1)");       //获取每个div下的索引为3n+1的子元素,索引从1开始
$("div label:first-child");     //获取每个div下的第一个label列表
$("div label:last-child");      //获取每个div下的最后一个label列表
$("div label:only-child");      //获取每个div下的是唯一子元素的label的列表
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: