jquery学习笔记之选择器

jquery选择器
1.基本选择器
$("#test")返回id为test的单个元素
$(".test")返回class为test的集合元素
$("p")返回标签名为<p>的集合元素
$("div,span.test")返回组合元素
2.层次选择器
$("ancestor descendant")返回集合元素 如$("div span")选取<div>里所有的<span>元素
$("parent>child")返回集合元素 如$("div>span")选取<div>下面元素名为<span>的子元素（跟上面那个不同，这里只选取子元素，不包括子元素里面的元素）
$("prev+next")返回集合元素 如$(".one+div")选取class为one的下一个<div>同辈元素 等价于$(".one").next("div")
$("prev~siblings")返回集合元素 $("#two~div") 选取id为two元素后面所有的同辈<div>元素 等价于$("#two").nextAll("div")
注：$("#two").siblings("div")能选取与id为two元素的所有同辈<div>元素
3.过滤选择器
基本过滤选择器
:first返回单个元素 如$("div:first")选取所有<div>元素中的第一个<div>
:last返回单个元素 如$("div:last")选取所有<div>元素中的最后一个<div>
:not(selector)返回集合元素 如$("input:not(.test)")选取所有<input>标签中除class为test的其他元素
:even返回集合元素 如$("li:even")选取索引数为偶数的所有<li>元素
:odd返回集合元素 如$("li:odd")选取索引数为奇数的所有<li>元素
:eq(index)返回单个元素 如$("div:eq(1)")选取索引数为1的<div>元素
:gt(index)返回单个元素 如$("div:gt(1)")选取索引数大于1的<div>元素
:lt(index)返回单个元素 如$("div:lt(1)")选取索引数小于1的<div>元素
注：index从0开始
:header返回集合元素 如$(":header")选取网页中所有的<h1><h2><h3>…………
:animated返回集合元素 如$("div:animated")选取所有正在执行动画的<div>
:focus返回集合元素 如$(":focus")获取当前焦点所在的元素
内容过滤选择器
:contain(text)选取含有文本内容为text的元素 如$("div:contain('luzhe')")选取含有文本luzhe的<div>元素
:empty选取不含子元素或者文本的空元素 如$(".test:empty")选取class为test没有子元素和文本的元素
:has(selector)选取含有选择器所存在元素的元素 如$("div:has(p)")选取含有<p>元素的<div>元素
:parent选取含有文本元素或者子元素的元素 如$("div:parent")选取拥有子元素或者为本的<div>元素
可见性过滤选择器
:hidden选取所有不可见的元素 不可见的元素包括<input type="hidden">,<div style="display:none">,<div style="visibility:hidden">
:visible选取所有可见的元素
属性过滤选择器
[attribute]选取拥有此属性的元素 如$("div[title]")选取所有拥有title的<div>元素
[attribute=value]选取atribute属性为value的元素 如$("li[class=luzhe]")选取class为luzhe的<li>元素
[attribute!=value]选取atribute属性不为value的元素 如$("li[class!=luzhe]")选取class不为luzhe的<li>元素
注：没有class属性的<li>也会被选中
[attribute^=value]选取属性值以value开始的元素 如$("div[title^=luzhe]")选取title属性为luzhe开始的<div>元素
[attribute$=value]选取属性值以value结束的元素 如$("div[title$=luzhe]")选取title属性为luzhe结尾的<div>元素
[attribute*=value]选取属性值中含有value的元素 如$("div[title*=luzhe]")选取title属性中包含luzhe的<div>元素
[attribute|=value]选取属性属以value为前缀的元素 如$("div[title|='luzhe']")选取以title属性以luzhe为前缀的<div>元素
[attribute~=value]选取属性用空格分隔的值中包含value的元素 如$("div[title~=luzhe]")选取title属性中用空格分隔的值中包含luzhe的<div>元素
[attribute1][attribute2][attributeN]符合属性过滤选择器
子元素过滤选择器
:nth-child(index/even/odd/equation表达式)选取每个父元素下的第Index个子元素或者奇偶元素 为每一个父元素匹配子元素并且Index是从1开始 :eq(index)只匹配一个元素
:first-child选取每个父元素的第一个子元素 :first只返回单个元素，而:first-child返回每个父元素的第一个子元素 如$("ul li:first-child")选取每个<ul>中的第一个<li>元素
:last-child选取每个父元素的最后一个子元素 :last只返回单个元素，而:last-child返回每个父元素的第一个子元素 如$("ul li:last-child")选取每个<ul>下的最后一个<li>元素
:only-child选取每个父元素的唯一一个子元素 如$("ul li:only-child")选取<ul>中的唯一<li>子元素
表单对象属性过滤选择器
:enabled选取表单中所有可用元素 如$("#form1 :enabled")
:disabled选取表单中所有不可用元素 如$("#form1 :disabled")
注：<input>标签中disabled属性为disabled的元素表示不可输入
:checked选取所有被选中的元素（单选框和复选框） 如$("input :checked")表示所有被选中的<input>元素
:selected选取所有被选中的选项元素(下拉列表) 如$("select option:selected")选取所有被选中的选项元素
4.表单选择器
:input选取所有<input><textarea><select><button>元素
:text选取所有单行文本框
:password选取所有密码框
:radio选取所有单选框
:checkbox选取所有复选框
:submit选取所有提交按钮
:image选取所有图像按钮
:reset选取所有重置按钮
:button选取所有按钮
:file选取所有上传域
:hidden选取所有不可见元素