博客已迁移到CSDN《https://blog.csdn.net/qq_33375499》
1、#id
根据给定的ID匹配一个元素，如果选择器中包含特殊字符，可以用双斜杆(\\) 转义
如：
查找ID 为 myDiv[bar] 的元素
HTML 代码:
<div id="notMe">
<p>id="notMe"</p>
</div>
<div id="myDiv[bar]">
id="myDiv[bar]"
</div>
jQuery 代码:
$("#myDiv\\[bar\\]");
结果:
[ <div id="myDiv[bar]">id="myDiv[bar]"</div> ]
2、element
根据给定元素名匹配所有元素
如：
查找一个 DIV 元素。
HTML 代码:
<div>DIV1</div>
<div>DIV2</div>
<span>SPAN</span>
jQuery 代码:
$("div");
结果:
[ <div>DIV1</div>, <div>DIV2</div> ]
3、 .class
根据类名进行匹配元素，一个用以搜索的类。一个元素可以有多个类，只要有一个符合就能被匹配到。（多个类 jquery代码为：$(".class1.class2.class3"),且顺序可以为乱序 ）
如：
查找所有类是 "myClass" 的元素.
HTML 代码:
<div class="notMe myClass1">div class="notMe"</div>
<div class="myClass a1 a3">div class="myClass"</div>
<span class="myClass a2 a4">span class="myClass"</span>
jQuery 代码:
$(".myClass");
结果:
[ <div class="myClass">div class="myClass"</div>, <span class="myClass">span class="myClass"</span> ]
4、*
匹配所有元素，多用于结合上下文来搜索
如：
找到每一个元素
HTML 代码:
<div>DIV</div>
<span>SPAN</span>
<p>P</p>
jQuery 代码:
$("*")
结果:
[ <div>DIV</div>, <span>SPAN</span>, <p>P</p> ]
5、selector1,selector2,selectorN
将每一个选择器匹配到的元素合并后一起返回（你可以指定任意多个选择器，并将匹配到的元素合并到一个结果内）
如：
找到匹配任意一个类的元素。
HTML 代码:
<div>div</div>
<p class="myClass">p class="myClass"</p>
<span>span</span>
<p class="notMyClass">p class="notMyClass"</p>
jQuery 代码:
$("div,span,p.myClass")
结果:
[ <div>div</div>, <p class="myClass">p class="myClass"</p>, <span>span</span> ]
6、ancestor descendant
在给定的祖先元素下匹配 所有(包括子元素的子元素) 的后代元素
参数：ancestor 任何有效选择器;descendant 用以匹配元素的选择器，并且它是第一个选择器的后代元素
如：
找到表单中所有的input 元素
HTML 代码:
<form>
<label>Name:</label>
<input name="name" />
<fieldset>
<label>Newsletter:</label>
<input name="newsletter" />
</fieldset>
</form>
<input id="inp1" name="none" />
jQuery 代码:
$("#inp1,form *")
结果:
[ <label>Name:</label>,<input name="name" />, <fieldset>, <label>Newsletter:</label>,<input name="newsletter" />,<input id="inp1" name="none" /> ]
7、parent > child
在给定的父元素下匹配所有的子元素（第一层级子元素，并且自身满足匹配结果，也会返回）
如：
匹配表单中所有当前表单的子元素
HTML 代码:
<form>
<label>Name:</label>
<input name="name" />
<fieldset>
<label>Newsletter:</label>
<input name="newsletter" />
</fieldset>
</form>
<input id="inp1" name="none" />
jQuery 代码:
$("#inp1,form > input")
结果:
[ <input name="name" />,<input id="inp1" name="none" /> ]
8、prev + next
匹配所有紧跟在 prev 之后的 next 元素
参数：prev 任何选择器;next 一个有效选择器并且紧接着第一个选择器
如：
匹配所有跟在lable后面的input和p元素
HTML 代码：
<form>
<label>Name:</label>
<input name="name" />
<fieldset>
<label>Newsletter:</label>
<input name="newsletter" />
</fieldset>
<label>Newsletter2:</label>
<p>p:</p>
<input name="newsletter2" />
</form>
<input id="inp1" name="none" />
jQuery 代码:
$("label + input,p")
结果：
[ <input name="name" />,<input name="newsletter" />,<p>p:</p> ]
9、prev ~ siblings
匹配prev元素之后的所有siblings 元素
参数：prev 任何有效选择器； siblings 一个选择器，并且它作为第一个选择器的同级
如：
找到所有与表单下所有label子集同辈的 input元素、p元素
HTML 代码：
<form>
<label>Name:</label>
<input name="name" />
<fieldset>
<label>Newsletter:</label>
<input name="newsletter" />
</fieldset>
<label>Newsletter2:</label>
<p>p:</p>
<input name="newsletter2" />
</form>
<input id="inp1" name="none" />
jQuery 代码:
$("form label ~ input,p")
结果：
[ <input name="name" />, <input name="newsletter" />, <p>p:</p>,<input name="newsletter2" />,<p>p:</p> ]
10、prev:first
获取prev选择器下的第一个元素
参数：prev 任何有效选择器
如：
获取form下所有label子元素后跟p的第一个p元素
$("form label + p:first")
11、prev:last
获取prev选择器下的最后一个元素
参数：prev 任何有效选择器
如：
获取form下所有label子元素后跟input的最后一个input元素
$("form label + input:last")
12、prev：not（selector1,selector2,selectorN）
去除所有prev选择器下的 给定选择器selector1，selector2,selectorN 的元素(在jquery1.3 之后才支持)
如：
查找所有form元素下所有子元素后跟input元素的input元素，并且input 元素class 属性不包含 .a1.a2
$("form label + input:not(.a2.a1)")
13、prev：even
匹配prev选择器下所有索引值为 偶数 的元素，从 0 开始计数
如：
查找表格的1/3/5...行（即索引值为0,2,4...）
$("table tr:even")
14、prev：odd
匹配prev选择器下所有索引值为 奇数 的元素，从 0 开始计数
如：查找表格的2/4/6...行（即索引值为1,3,5...）
$("table tr:odd")
15、prev:eq(index)
匹配prev选择器下给定index索引值的元素
如：
查找table的第三行
$("table tr:eq(2)")
16、prev：gt(index)
匹配prev选择器下 大于 给定 index 索引值的元素
如：
查找table下第二行以后的行
$("table tr:gt(1)");
17、prev:lt(index)
匹配prev选择器下 小于 给定 index 索引值的元素
如：
查找table下第1行、第二行
$("table tr:lt(2)")
18、prev:header
匹配prev选择器下所有如h1/h2/h3/h4...子类的标题元素
如：
匹配form下所有标题元素
$("form *:header")
19、prev:animated
匹配prev选择器下所有正在执行动画效果的元素
如：
只有对不在执行动画效果的元素执行一个动画特效
$("#run").click(function(){
$("div:not(:animated)").animate({ left: "+=20" }, 1000);
});
20、:focus
触发每一个匹配元素的focus事件(这将触发所有绑定的focus函数，注意：某些对象不支持focus方法)
如：
当页面加载后将 id 为 'login' 的元素设置焦点:
$("#login:focus");
21、prev:contains(text)
匹配prev选择器下所有 包含 给定文本的元素
如：查找所有包含“A”文本的div元素
$("div:contains('A')")
22、prev:empty
匹配prev选择器下所有 不包含子元素或者文本 的空元素
23、prev:has(selector1,selector2,selectorN)
匹配prev选择器下所有含有selector1||selector||selectorN的元素的元素
如：
匹配所有子元素包含class为 .a1或.a3 的fieldset元素
HTML 代码：
<fieldset>
<label>Newsletter:</label>
<input name="newsletter" class="a1 a2" />
<h3>h3:</h3>
</fieldset>
<fieldset>
<label class="a3">Newsletter:</label>
</fieldset>
jQuery 代码：
$("fieldset:has(.a1,.a3)")
结果:
[
<fieldset>
<label>Newsletter:</label>
<input name="newsletter" class="a1 a2" />
<h3>h3:</h3>
</fieldset>,
<fieldset>
<label class="a3">Newsletter:</label>
</fieldset>
]
24、prev:parent
匹配prev选择器下所有包含子元素或文本的元素(存在子元素或文本的元素)
25、prev:hidden
匹配prev选择器下所有不可见元素(display:none)，或者type为hidden的元素(<input type='hidden' />)
26、prev:visible
匹配prev选择器下所有可见元素
27、prev[attribute]
匹配prev选择器下所有包含给定属性的元素。注意，在jQuery 1.3中，前导的@符号已经被废除！如果想要兼容最新版本，只需要简单去掉@符号即可。
28、prev[attribute = 'value']
匹配prev选择器下所有包含给定的属性是某个特定值的元素
29、prev[attribute! = 'value']
匹配prev选择器下所有不包含给定属性，或者属性不等于特定值的元素 ( 此选择器等价于:not([attr=value]);要匹配含有特定属性但不等于特定值的元素，请使用[attr]:not([attr=value]) )
30、prev[attribute ^= 'value']
匹配prev选择器下给定的属性是以某些值开始的元素
如：
匹配所有id以mydiv 开头的div
$("div[id ^= 'mydiv']")
31、prev[attribute $= 'value']
匹配prev选择器下给定的属性是以某些值结束的元素
如：
匹配所有id以mydiv 结束的div
$("div[id $= 'mydiv']")
32、prev[attribute *= 'value']
匹配prev选择器下给定属性是包含某些值的元素
如：
匹配所有id包含div 的div
$("div[id *= 'div']")
33、[selector1][selector2][selectorN]
复核属性选择器，需要同时满足多个条件时使用。
如：
$("input[id][name$='man']")
34、prev:nth-child(index)
匹配prev选择器下所有元素的子元素的第N个子或奇偶元素
':eq(index)' 只匹配一个元素，而这个将为每一个父元素匹配子元素。:nth-child从 1 开始的，而:eq()是从0算起的！可以使用:
nth-child(even)
:nth-child(odd)
:nth-child(3n)
:nth-child(2)
:nth-child(3n+1)
:nth-child(3n+2)
参数：index 要匹配元素的序号，从1开始
如：
在每个 ul 查找第 2 个li
HTML 代码:
<ul>
<li>John</li>
<li>Karl</li>
<li>Brandon</li>
</ul>
<ul>
<li>Glen</li>
<li>Tane</li>
<li>Ralph</li>
</ul>
jQuery 代码:
$("ul li:nth-child(2)")
结果:
[ <li>Karl</li>, <li>Tane</li> ]
35、prev:first-child
匹配prev选择器下的所有元素的第一个子元素
36、prev:last-child
匹配prev选择器下的所有元素的最后一个子元素
37、prev:only-child
匹配prev选择器下中某个只有唯一一个子元素的元素。如果含有其他元素，将不会被匹配
38、prev:input
匹配prev选择器下所有的input、textarea、select和button元素
39、prev:text
匹配prev选择器下所有 单行文本框<input type='text' />
40、prev:password
匹配prev选择器下所有 密码框<input type='password' />
41、prev:radio
匹配prev选择器下所有 单选按钮<input type='radio' />
42、prev:checkbox
匹配prev选择器下所有 复选按钮<input type='checkbox' />
43、prev:submit
匹配prev选择器下所有 提交按钮<input type='submit' />
44、prev:image
匹配prev选择器下所有 图片域<input type='image' />
45、prev:reset
匹配prev选择器下所有 重置按钮<input type='reset' />
46、prev:button
匹配prev选择器下所有 按钮<input type='buttton' />、<button></button>
47、prev:file
匹配prev选择器下所有 文件域<input type='file' />
48、prev:enabled
匹配prev选择器下所有 可用元素(disabled)
49、prev:disabled
匹配prev选择器下所有 不可用元素
50、prev:checked
匹配prev选择器下所有选择的被选中元素(复选框、单选框等，不包括 select中的option)
51、prev:selected
匹配prev选择器下所有选中的option元素
