Jquery 選擇器

1.基本選擇器

　　選擇器　　　　　　描述　　　　　　　　　　　　　　　　　　　

　　#id　　　　　　　根據給定的id匹配匹配一個元素  例如 $('#id')

　　.class　　　　　　根據給定的類名匹配元素   例如 $('.myclass')

　　selector1,selector2...    將每個選擇器匹配到的元素合併後一塊兒返回   例如 $(selector1,selector2..)

　　*　　　　　　　　　　匹配全部的元素

　

2.層次選擇器

　　　選擇器　　　　　　　　　　　　　　　　描述　　　

　　　$("ancestor descendant")　　　　選取ancestor元素裏面的全部descendant元素

　　　$("parent > child")　　　　選取parent元素下的child元素

　　　$("prev + next")　　　　　　選取緊接在prev元素後的next元素

　　　$("prev ~ siblings")　　　　選取prev元素以後的全部siblings元素

3.過濾選擇器　

　　1.基本過濾器選擇器

　　　選擇器　　描述　　　　　　　

　　　:frist　　選取第一個元素        　　 例如：$("div:frist") 選取全部div的第一個

　　　:last      選取最後一個元素　　　　 例如：$("div:last") 選取全部div的最後一個

　　　:even 　獲取索引是偶數的全部元素　　　例如：$("tr:even") 選取全部tr的索引爲偶數的

　　　:odd 　　獲取索引是奇數的全部元素　　　　例如：$("tr:odd") 選取全部tr的索引爲奇數的

　　　:not(selector)獲取除了選擇器之外的元素　　　　例如：$("div:not('.mydiv')") 選取全部div爲.mydiv覺得的全部div

　　　:eq(index)  獲取索引等於index的元素　　　　例如：$("div:eq(1)") 選取div索引爲1的div

　　　:gt(index)  獲取索引大於index的元素　　　　例如：$("div:gt(1)") 選取全部div索引大於1的(返回集合)

　　　:lt(index)   獲取索引小於index的元素　　　　　　例如：$("div:lt(1)") 選取全部div索引小於1的(返回集合)

　　　:header　 獲取全部的標題元素，好比(h1,h2,...)  例如：$("div:header") 選取全部div的標題元素

　　　:animated   獲取當前執行jQuery動畫的元素   例如：$("div:animated") 選取當前執行動畫的div

　　3.子元素過濾選擇器

　　　　　　

選擇器	描述	示例
:nth-child(index/even/odd/eq)	選擇的他們全部父元素的第n個子元素。(這裏的index是從1開始算起)	$("p:nth-child(2)")選取body中第二個p元素
:first-child	選擇全部父級元素下的第一個子元素。	$("div span:frist-child") 匹配 div 中查找第一個 span
:last-child	選擇全部父級元素下的最後一個子元素。	$("div span:last-child") 匹配 div 中查找最後一個 span
:only-child	若是某個元素是其父元素的惟一子元素，那麼它就會被選中	$("ul li:only-child")在ul中選取是惟一子元素的li元素

　　2.內容過濾器選擇器　

　　

選擇器	描述	示例
:contains(text)	選取含有文本內容爲text的元素	$("div:contains('abc')")選取含有文本 「abc"的div元素
:empty	選擇全部沒有子元素的元素（包括文本節點）。	$("div:empty")選取不包含子元素(包括文本元素)的div元素
:has(selector)	選取含有選擇器所匹配的元素的元素	$("div:has(p)")選取含有P元素的div元素
：parent	選擇全部含有子元素或者文本的父級元素。	$("div:parent")選取擁有子元素(包括文本元素)的div元素

　　　　　　　　

 

　　4.屬性過濾選擇器

　　　　　　

選擇器	描述	示例
[attribute]	選取擁有此屬性的元素	$("div[id]")選取擁有屬性Id的div元素
[attribute=value]	選取屬性的值爲value的元素	$("div[title=test")選取屬性title爲test的div元素
[attribute!=value]	選取屬性的值不等於value的元素	$("div[title!=test]")選取屬性title不等於test的div元素(注意，沒有屬性的div元素也會被選取)
[attribute^=value]	選取屬性的值以value開始的	$("div[title^=test]")選取屬性title以test開始的div元素
[attribute$=value]	選取屬性的值以value結束的	$("div[title$=test]")選取屬性title以test結尾的div元素
[attribure|=value]	選取屬性的前綴等於value或爲value 和-鏈接爲前綴的元素	$("div[title|=test]")選取屬性title前綴等於test或以test-*的div元素 (注意，沒有title屬性的div元素也會被選取)
[attribute~=value]	選取屬性的值包含value的元素，value和其餘字符用空格分隔	$("div[title~=test]")選取屬性title包含test的div元素(注意，沒有title屬性的div元素也會被選取)
[attribute*=value]	選取屬性的值含有value的元素	$("div[title*=test]")選取屬性title含有test的div元素
[selector1] [selector2]	用屬性選擇器合併成一個複合屬性選擇器，知足多個條件	$("div[id][title$=test]")選取擁有屬性Id，而且屬性title以test結尾

 

　　5.表單對象屬性過濾選擇器

　　　　

　　　　　　

選擇器	描述	示例
:enabled	選取全部可用元素	$("#form1:enabled")選取Id爲from1的表單內全部可用元素
:disabled	選取全部不可用元素	$("#form1:disabled")選取id爲form1的表單內的全部不能夠的元素
:checked	選取全部被選中的元素(單選按鈕，複選框)	$("input:checked")選取全部被選中的input元素
:selected	選取全部被選中的選項元素(下拉列表)	$("select:selected")選取全部被選中的選項元素

　　

　　6.可見性過濾選擇器

　　　　

選擇器	描述	示例
：hidden	選擇全部隱藏的元素。	$(":hidden")選取全部不可見的元素。 包括<input type=hidden/>, 　<div style="display:none"/>和 <div style="visibility:hidden"/>等元素。 若是隻是選取input元素，能夠使用$("input:hidden")
：visible	選取全部可見的元素	$("div:visible")選取全部可見的div元素

4. 表單選擇器　　

　　　　

選擇器	描述	示例
:input	選取全部的input,textarea,select,button元素	$(":input")
:text	選取全部的單行文本框	$(":text")
:password	選取全部的密碼框	$(":password")
:radio	選取全部的單選框	$(":radio")
:checkbox	選取全部的複選框	$(":checkbox")
:submit	選取全部的提交按鈕	$(":submit")
:image	選取全部的圖像按鈕	$(":image")
:reset	選取全部的重置按鈕	$(":reset")
:button	選取全部的按鈕	$(":button")
:file	選取全部的上傳文件	$(":file")
:hidden	選取全部不可見的元素	$(":hidden")