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

本文是jQuery选择器，主要总结归纳所有的jQuery选择器。

2017-05-18 14:03 288 查看

jQuery 选择器

以下选择器的棕色部分，表示该部分需要根据实际需要进行设置。这些部分可能是一个选择器、序号、索引或者其他符合要求的表达式(表格中s1s2sN中的蓝色s2也是如此，这里标注为蓝色，以便于与两侧的s1和sN进行区分)。

选择器	起始版本	实例	选取
基本选择器——根据多个选择器的组合筛选元素
s1,s2,sN	1.0	$("p,div,#abc")	所有的p元素、div元素和id="abc"的元素
s1s2sN	1.0	$(":radio[name=uid]:checked")	所有被选中的name="uid"的radio元素
ancestor escendant	1.0	$("p span")	<p>标签内的所有<span>元素
parent > child	1.0	$("p > span")	所有作为<p>标签的直接子元素的<span>元素
prev + next	1.0	$("label + input")	所有紧跟在<label>元素后面的那个同辈<input>元素
prev ~ sibings	1.0	$("tr#L2 ~ tr")	在id="L2"的<tr>元素之后的所有同辈<tr>元素
基本选择器——根据id、class类名、标签名等筛选元素
*	1.0	$("*")	所有元素
#id	1.0	$("#abc")	id="abc"的元素
.className	1.0	$(".post")	所有包含类名"post"的元素
tagName	1.0	$("p")	所有<p>元素
伪类选择器——根据元素在匹配到的所有元素中的特定次序筛选元素
:first	1.0	$("p:first")	第一个<p>标签
:last	1.0	$("p:last")	最后一个<p>标签
:even	1.0	$("tr:even")	所有偶数<tr>标签
:odd	1.0	$("tr:odd")	所有奇数<tr>标签
:eq(index)	1.0	$("li:eq(3)")	第4个li标签( index 从0开始算起)
:gt(index)	1.0	$("li:gt(2)")	所有 index 大于2的li标签(第4、5、6……个li标签)
:lt(index)	1.0	$("li:lt(2)")	所有 index 小于2的li标签(第1、2个li标签)
伪类选择器——根据元素在父元素的子元素中的特定次序筛选元素
:first-child	1.1.4	$("span:first-child")	所有作为父元素的第一个子元素的<span>元素
:last-child	1.1.4	$("span:last-child")	所有作为父元素的最后一个子元素的<span>元素
:only-child	1.1.4	$("span:only-child")	所有作为父元素的唯一子元素的<span>元素
:nth-child(n)	1.1.4	$("li:nth-child(2)")	所有作为父元素的第2个子元素的<li>标签( n 从1开始算起)
:nth-last-child(n)	1.9	$("li:nth-last-child(2)")	所有作为父元素的倒数第2个子元素的<li>标签
:first-of-type	1.9	$("p:first-of-type")	所有作为父元素的第一个<p>类型的子元素
:last-of-type	1.9	$("p:last-of-type")	所有作为父元素的最后一个<p>类型的子元素
:only-of-type	1.9	$("p:only-of-type")	所有作为父元素的唯一一个<p>类型的子元素
:nth-of-type(n)	1.9	$("li:nth-of-type(2)")	所有作为父元素的第2个<li>类型的子元素( n 从1开始算起)
:nth-last-of-type(n)	1.9	$("li:nth-last-child(2)")	所有作为父元素的倒数第2个<li>类型的子元素
伪类选择器——根据包含、排除、可见、动画或其他关系筛选元素
:has(selector)	1.1.4	$("ul:has(li.abc)")	所有包含类名为"abc"的<li>标签的<ul>元素
:not(selector)	1.0	$("input:not(:text)")	所有不是文本框的<input>元素
:contains(text)	1.1.4	$(":contains(abc)")	所有包含文本"abc"的元素
:parent	1.0	$(":parent")	所有包含子元素或文本内容(哪怕是空格或换行)的元素
:empty	1.0	$(":empty")	所有没有子元素和文本内容(哪怕是空格或换行)的元素
:visible	1.0	$(":visible")	所有可见的元素
:hidden	1.0	$(":hidden")	所有不可见的元素(包括type="hidden"的<input>元素)
:header	1.2	$(":header")	所有标题标签：h1 ~ h6
:animated	1.2	$(":animated")	所有正在执行动画效果的元素
:focus	1.6	$(":focus")	当前获得焦点的元素
:root	1.9	$(":root")	当前文档的根元素(<html>元素)
:target	1.9	$(":target")	id属性等于当前页面URI中的hash码值的元素
:lang(language)	1.9	$(":lang(en)")	所有lang属性以"en"为前缀的元素
属性相关选择器
[attribute]	1.0	$("[href]")	所有带有href属性的元素
[attribute=value]	1.0	$("[name=uid]")	所有name="uid"的元素
[attribute!=value]	1.0	$("[name!=uid]")	所有name属性的值不等于"uid"的元素
[attribute^=value]	1.0	$("[name^=uid]")	所有name属性的值以"uid"开头的元素
[attribute$=value]	1.0	$("[src$='.gif']")	所有src属性以".gif"结尾的元素
[attribute\|=value]	1.0	$("[name\|=uid]")	name属性的值等于"uid"，或以"uid-"开头的所有元素
[attribute~=value]	1.0	$("[name~='uid']")	name属性的值包含给定的单词"uid"的所有元素("uid"与其他词以空格分隔)
[attribute*=value]	1.0	$("[name*=uid]")	所有name属性的值包含"uid"的元素
伪类选择器——表单相关
:input	1.0	$(":input")	所有input、select、textarea和button标签
:text	1.0	$(":text")	所有type="text"的<input>元素
:password	1.0	$(":password")	所有type="password"的<input>元素
:radio	1.0	$(":radio")	所有type="radio"的<input>元素
:checkbox	1.0	$(":checkbox")	所有type="checkbox"的<input>元素
:submit	1.0	$(":submit")	所有type="submit"的<input>和<button>元素
:reset	1.0	$(":reset")	所有type="reset"的<input>元素和<button>元素
:button	1.0	$(":button")	所有<button>标签(不区分type)和type="button"的<input>元素
:image	1.0	$(":image")	所有type="image"的<input>元素
:file	1.0	$(":file")	所有type="file"的<input>元素
伪类选择器——表单状态相关(表单控件是指input、select、textarea、button、option元素)
:enabled	1.0	$(":enabled")	所有可用(没有 disabled 属性)的表单控件元素
:disabled	1.0	$(":disabled")	所有禁用(带有 disabled 属性)的表单控件元素
:selected	1.0	$(":selected")	所有被选中的<option>元素
:checked	1.0	$(":checked")	所有被选中的radio、checkbox和<option>元素

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航