一、基本选择器
1.ID选择器 $("#id")
2.类选择器 $(".class")
3.元素选择器 $("element")
4.通配选择器 $("*")
5.集合选择器 $("#id,p,span")
二、层次选择器
1.$("ancestor descendant") 选取ancestor元素里的所有descendant(后代)元素
2.$("parent>child") 选取parent 元素下的child(子)元素,与后代元素的区别是后代元素包括子元素,孙子元素,重孙子元素.
3.$("prev+next") 等价于$("prev").next("next") 选取紧接在prev元素后的next元素
4.$("prev~siblings") 等价于$("prev").nextAll() 即为之后的所有同辈节点 选取prev元素之后的所有siblings元素
三、过滤选择器
1.基本过滤选择器
:first 选取第1个元素
:last 选取最后一个元素
:not(selector) $("input:not(.myClass)") 选取所有class不是myClass的<input>元素
:even $("input:even") 选取索引是偶数的<input>元素 索引从0开始
:odd 索引是奇数的所有元素,从0开始
:eq(index) 选取索引等于index的元素(index从0开始)
:gt(index) 索引大于index的元素 (index从0开始)
:lt(index) 索引小雨index的元素(index从0开始)
:header 选取所有的标题元素,例如h1,h2等
:animated 选取当前正在执行动画的所有元素
2.内容过滤选择器
:contains(text) 选取含有文本内容为“text”的元素
:empty 选取不包含子元素或者文本的空元素
:has(selector) 选取含有选择器所匹配的元素的元素
:parent 选择含有子元素或者文本的元素
3.可见性过滤选择器
:hidden 选取所有不可见的元素 $(":hidden") 包括<input type="hidden"/> <div style="display:none;"><div style="visibility:hidden">
:visible 选取所有可见的元素 $("div:visible") 选取所有可见的div
4.属性过滤选择器
[attribute] $("div[id]") 选取拥有属性id的元素
[attribute=value] $("div[title=test]") 选取属性title为“test”的<div> 元素
[attribute!=value] $("div[title!=test]")选取属性title不为“test”的<div> 元素,没有title属性也会被选中
[attribute^=value] $("div[title^=test]") 选取属性title以“test"开始的div元素
[attribute$=value] $("div[title$=test]") 选取属性title以“test"结束的div元素
[attribute*=value] $("div[title*=test]") 选取属性title含有”test“的div元素
[selector1][selector2][selectorN] $("div[id][title$='test']") 选取拥有属性id,并且属性title以”test“结束的div元素
5.子元素过滤选择器
:nth-child(index/even/odd/equation) :eq(index)只匹配一个元素 ,而:nth-child姜维每一个父元素匹配子元素,并且:nth-child(index)的index是从1开始算起的,而: eq(index)是从0开始
:first-child 每个父元素的第1个子元素
:last-child 每个父元素的最后一个子元素
:only-child 如果某元素是它父元素中唯一的子元素,那么将会被匹配。如果父元素中含有其他元素,则不会被匹配