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

JQuery选择器归纳

2016-06-02 21:24 267 查看
1、基本选择器

选择符 匹配元素

* 所有元素

id 给定ID的元素

element 给定类型的所有元素

.class 给定类的所有元素

a,b 与a或b匹配的元素

a b a的后代元素中与b匹配的元素

a>b a的直接子元素中与b匹配的元素

a+b a的直接同辈元素中与b匹配的元素

a~b a的同辈元素中与b匹配的元素

2、位置选择器

选择符 匹配元素

a b:nth-child(index) a的子元素中,第index个与b匹配的元素(从1开始计数)

a b:nth-child(even) a的子元素中,第偶数个与b匹配的元素(从1开始计数)

a b:nth-child(odd) a的子元素中,第奇数个与b匹配的元素(从1开始计数)

a b:nth-child(2n+2) a的子元素中,第2n+2个与b匹配的元素(从1开始计数),n为自然数

a b:nth-last-child() 同:nth-child(),从最后一个元素开始计数

a b:first-child a的子元素中,第1个与b匹配的元素

a b:last-child a的子元素中,最后一个个与b匹配的元素

:only-child 作为其父元素唯一一个子元素的元素

a b:nth-of-type() 同:nth-child(),只计同类元素

a b:nth-last-of-type() 同:nth-last-child(),只计同类元素

a b:first-of-type() 同:first-child(),只计同类元素

a b:last-of-type() 同:last-child(),只计同类元素

a b:only-of-type() 没有同名元素的元素

3、属性选择器

选择符 匹配元素

[attr] 带有属性attr的元素

[attr="value"] attr属性值为value的元素

[attr!="value"] attr属性值不为value的元素)

[attr^="value"] attr属性值以value开头的元素

[attr$="value"] attr属性值以value结尾的元素

[attr*="value"] attr属性值包含value字符串的元素

[attr~="value"] attr属性值是空格分隔的字符串,其中一个字符串值是value的元素

[attr|="value"] attr属性值等于value或value后跟一个连字符(-)的元素

4、表单选择器

选择符 匹配元素

:input 所有<input>、<textarea>、<select>和<button>元素

:text type=”text”的<input>元素

:password type=”password”的<input>元素

:file type=”file”的<input>元素

:radio type=”radio”的<input>元素

:checkbox type=”checkbox”的<input>元素

:submit type=”submit”的<input>元素

:image type=”image”的<input>元素

:reset type=”reset”的<input>元素

:button type=”button”的<input>元素

:enabled 启用的表单元素

:disabled 禁用的表单元素

:checked 选中的复选框和单选按钮

:selected 选中的<option>元素

5、过滤选择器

选择符 匹配元素

:root 文档根元素

:header 标题元素,h1~h6

:animated 动画正在运行的元素

:contains(text) 包含文本text的元素

a:empty 不包含子节点的a元素

a:has(b) 至少包含一个b元素匹配的a元素(返回父元素a而非子元素b)

:parent 与:empty相反,返回包含子节点的元素

:hidden 隐藏的元素,包括<input type="hidden">

:visible 可见元素

:focus 获得焦点的元素

:lang(language) 给定语言代码的元素

:target URI标识符指向的目标元素,具体见::target用法

6、用于结果集中的选择器

这类选择器在CSS中不存在,但可以用于JQuery的结果中进行筛选。

选择符 匹配元素

:first 结果集中的第一个元素,对应方法为first(),如$("a b:first")<==>$("a b").first()

:last 结果集中的最后一个元素,对应方法为last(),如$("a b:last")<==>$("a b").last()

:not(a) 结果集中不与a匹配的元素,对应方法为not(),如$("a b:not(c)")<==>$("a b").not(c)

:even 结果集中索引是偶数的元素(从0开始),如$("a b:even")

:odd 结果集中索引是奇数的元素(从0开始),如$("a b:odd")

:eq(index) 结果集中索引是index的元素(从0开始),对应方法是eq(index),如$("a b:eq(2)")<==>$("a b").eq(2)

:gt(index) 结果集中索引大于index的元素(从0开始),如$("a b:gt(2)")

:lt(index) 结果集中索引小于index的元素(从0开始),如$("a b:lt(2)")
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  jquery class