jQuery学习之选择器
最近又看了下《锋利的jQuery》,想系统的再整理下jQuery的有关知识
选择器是jQuery的根基，事件处理，遍历DOM和Ajax操作都依赖于选择器，这次我们先从
选择器说起。
首先，现在的jQuery是支持CSS1到CSS3选择器
这里一共包含四大类：基本选择器、层次选择器、过滤选择器、表单选择器
一，基本选择器
（1）#id
（2）.class
（3）element
（4）*
（5）selector1,selector2,......,selectorN（将每一个选择器匹配到的元素合并后返回）
exp:$（“div,span,p.myClass”）选取所有<div>，<span>和拥有class为myClass的<p>标签中的一组元素
二，层次选择器
（1）$("ancestor descendant")
exp:$("div span") 选取<div>中的<span>
（2）$("parent>child")
exp：$("div>span") 选取<div>下名为<span>的子元素
（3）$("prev+next")
exp:$(".myClass+div")选取class名为"myClass"的下一个<div>同辈元素
（4）$("prev~sibilings")
exp:$("#mine~div")选取id为“mine”元素后面所有的<div>同辈元素
三，过滤选择器（分为五种）
【1】基本过滤选择器
（1）：first
exp：$("div:first")选取所有<div>元素中的第一个<div>元素
（2）：last
（3）：not(selector) 去除所有与给定选择器匹配的元素
exp:$("input:not(.myClass)") 选取class不是myClass的<input>
（4）：even 选取索引是偶数的所有元素 索引从0开始
（5）: odd 选取索引是奇数的所有元素
（6）: eq（index）索引等于index的元素
（7）: gt（index）索引大于index的元素
（8）:lt（index）索引小于index的元素
（9）:header 选取所有的标题元素
exp：$（“：header”）选取网页中所有的<h1>，<h2>，<h3>
（10）：animated 选取正在执行动画的元素
（11）：focus 选取当前获取焦点的元素
【2】内容过滤选择器
（1） ：contains(text) 选取含有文本内容为“text”的元素
exp：$("div：contains('me')") 选取含有文本"me"的<div>元素
（2）：empty 选取不包含子元素或者文本的空元素
（3）：has(selector) 选取含有选择器所有匹配元素的元素
exp:$("div:has(p)") 选取含有<p>元素的<div>元素
（4）：parent 选取含有子元素或者文本的元素
【3】可见性过滤选择器
（1）：hidden 选取所有不可见的元素
（2）：visible 选取所有可见的元素
【4】属性过滤选择器
（1）[attr] 选取拥有此属性的元素
exp:$("div[id]")选取拥有id的div
（2）[attr=val] 选取属性值等于val的元素
（3）[attr!=val] 没有该属性的元素也会不选择
（4）[attr^=val]选取属性值以val开始的元素
exp:$("div[title]^=test") 选取属性title以”test“开始的div元素
（5）[attr$=val]选取属性以val结尾的元素
（6）[attr*=val]选取属性值含有val的元素
（7）[attr|=val]选取属性等于给定字符串或以该字符串为前缀（该字符串后跟连字符”-“）的元素
exp:$(‘div[title|=”en“]’)选取属性title等于"en"或以”en“为前缀的元素
（8）[attr~=val]选取属性用空格分隔的值中包含一个给定的元素
exp：$(‘div[title~=”uk“]’)选取title用空格分隔的值中包含”uk“元素
（9）[attr1][attr2][attrN] 复合属性选择,每选择一次，缩小一次
【5】子元素过滤选择器
（1）nth-child(index/even/odd/equation) 索引从1开始
- :nth-child(3n+1)选取每个父元素下所有是（3n+1）的元素
（2）：first-child
（3）：last-child
（4）：only-child
【6】表单对象属性过滤选择器
（1）：enabled 选取所有可用元素
（2）：disable 选取所有不可用的元素
（3）：checked
（4）: selected
四，表单选择器
（1） ：input 选择所有<input> <textarea> <select> <button>元素
（2）：text
（3）：password
（4）：radio
（5）：chechbox
（6）：submit
（7）：image
（8）：reset
（9）：button
（10）：file
（11）：hidden
注：
（1）属性值中包含”.“ ”、“ ”#“需要用”\\“进行转移，否则会报错
（2）如果使用了1.3.1一下的版本，属性选择器前需要加@
（3）选择器中的空格需要特别注意，
exp:$('.test :hidden') 选取class为”test“的元素里面隐藏的元素
$('.test:hidden') 选取隐藏class为”test“的元素
