jQuery选择器

jQuery基本选择器

名称 用法 描述
ID选择器 $('#id'); 获取指定ID的元素
类选择器 $('.class'); 获取同一类class的元素
标签选择器 $('div'); 获取同一类标签的所有元素
并集选择器 $('div,p,li'); 使用逗号分隔,只要符合条件之一就可。
交集选择器 $('div.redClass'); 获取class为redClass的div元素


jQuery层级选择器

名称 用法 描述
子代选择器 $('ul > li'); 使用-号,获取儿子层级的元素,注意,并不会获取孙子层级的元素
后代选择器 $('ul li'); 使用空格,代表后代选择器,获取ul下的所有li元素,包括孙子等


jQuery过滤选择器

  • 这类选择器都带冒号:
名称 用法 描述
:eq(index) $('li:eq(2)').css('color', 'red'); 获取到的li元素中,选择索引号为2的元素,索引号index从0开始。
:odd $('li:odd').css('color', 'red'); 获取到的li元素中,选择索引号为奇数的元素
:even $('li:even').css('color', 'red'); 获取到的li元素中,选择索引号为偶数的元素


jQuery筛选选择器(方法)

  • 筛选选择器的功能与过滤选择器有点类似,但是用法不一样,筛选选择器主要是方法。
名称 用法 描述
children(selector) $('ul').children('li') 相当于$('ul-li'),子类选择器
find(selector) $('ul').find('li'); 相当于$('ul li'),后代选择器
siblings(selector) $('#first').siblings('li'); 查找兄弟节点,不包括自己本身。
parent() $('#first').parent(); 查找父亲
eq(index) $('li').eq(2); 相当于$('li:eq(2)'),index从0开始
next() $('li').next() 找下一个兄弟
prev() $('li').prev() 找上一次兄弟
鲜花会生锈,盐巴会腐烂
原文地址:https://www.cnblogs.com/hunterxing/p/9713248.html