4大類：基本選擇器、層次選擇器、過濾選擇器、表單選擇器
目錄
1、jquery基本選擇器
基本選擇器是JQuery最常用的選擇器，也是最簡單的選擇器，它通過元素id、class和標籤名來查找DOM元素。
|
$("#myELement") |
選擇id值等於myElement的元素，id值不能重複在文檔中只能有一個id值是myElement所以得到的是唯一元素 |
| $("div") | 選擇所有的div標籤元素，返回div元素數組 |
| $(".myClass") | 選擇使用myClass類的css的所有元素 |
| $("*") | 選擇文檔中的所有的元素，可以運用多種的選擇方式進行聯合選擇：例如$("#myELement,div,.myclass") |
注意：在網頁中id只能使用一次，即id具有唯一性，但class是允許重複使用的。
2、jquery層次選擇器
層次選擇器通過DOM元素間的層次關係來獲取元素，主要的層次關係包括父子、後代、相鄰、兄弟關係。
| $("form input") | 選擇所有的form元素中的input元素 |
| $("#main > *") | 選擇id值爲main的所有的子元素 |
| $("label + input") | 選擇所有的label元素的下一個input元素節點，經測試選擇器返回的是label標籤後面直接跟一個input標籤的所有input標籤元素 |
| $("#prev ~ div") | 同胞選擇器，該選擇器返回的爲id爲prev的標籤元素的所有的屬於同一個父元素的div標籤 |
說明：只有這個方法返回的是JQuery對象才能進行鏈式操作。
3、jquery過濾選擇器
過濾選擇器主要是通過特定的過濾規則來篩選出所需的DOM元素，過濾規則與CSS中的僞類選擇器語法相同，即選擇器都以一個冒號(:)開頭（關於css僞類選擇器更多知識可以參考css學習手冊）。按照不同的過濾規則，過濾選擇器可以分爲基本過濾，內容過濾，可見性過濾，屬性過濾，子元素過濾和表單對象屬性過濾選擇器共六種選擇器。下面我們分別來簡單看一下jquery這六種過濾選擇器
（1）jquery基本過濾選擇器
過濾選擇器是根據某類過濾規則進行元素的匹配，書寫時都以(:)開頭；簡單過濾選擇器是過濾選擇器中使用最廣泛的一種。
$("tr:first")：選擇所有tr元素的第一個
$("tr:last")：選擇所有tr元素的最後一個
$("input:not(:checked) + span") ：過濾掉：checked的選擇器的所有的input元素
$("tr:even")：選擇所有的tr元素的第0，2，4... ...個元素（注意：因爲所選擇的多個元素時爲數組，所以序號是從0開始）
$("tr:odd")：選擇所有的tr元素的第1，3，5... ...個元素
$("td:eq(2)")：選擇所有的td元素中序號爲2的那個td元素
$("td:gt(4)") ：選擇td元素中序號大於4的所有td元素
$("td:ll(4)")：選擇td元素中序號小於4的所有的td元素
$(":header")：匹配如 h1, h2, h3之類的標題元素.這個是專門用來獲取h1,h2這樣的標題元素
$("div:animated")：匹配所有正在執行動畫效果的元素
（2）jquery內容過濾選擇器
內容過濾選擇器的過濾規則主要體現在它所包含的子元素和文本內容上。
$("div:contains('John')") ：選擇所有div中含有John文本的元素
$("td:empty") ：選擇所有的爲空（也不包括文本節點）的td元素的數組
$("div:has(p)") ：選擇所有含有p標籤的div元素
$("td:parent")：選擇所有的以td爲父節點的元素數組
（3）jquery可見性過濾選擇器
可見度過濾選擇器是根據元素的可見和不可見狀態來選擇相應的元素。
$("div:hidden")：選擇所有的被hidden的div元素
$("div:visible")：選擇所有的可視化的div元素
（4）jquery屬性過濾選擇器
屬性過濾選擇器的過濾規則是通過元素的屬性來獲取相應的元素。
$("div[id]")： 選擇所有含有id屬性的div元素
$("input[name='newsletter']")：選擇所有的name屬性等於'newsletter'的input元素
$("input[name!='newsletter']") ：選擇所有的name屬性不等於'newsletter'的input元素
$("input[name^='news']")： 選擇所有的name屬性以'news'開頭的input元素
$("input[name$='news']") ：選擇所有的name屬性以'news'結尾的input元素
$("input[name*='man']") ：選擇所有的name屬性包含'news'的input元素
（5）jquery子元素過濾選擇器
$("ul li:nth-child(2)"),$("ul li:nth-child(odd)"),$("ul li:nth-child(3n + 1)") ：匹配其父元素下的第N個子或奇偶元素.這個選擇器和之前說的基礎過濾(Basic Filters)中的eq() 有些類似,不同的地方就是前者是從0開始,後者是從1開始。
$("div span:first-child")：返回所有的div元素的第一個子節點的數組
$("div span:last-child")：返回所有的div元素的最後一個節點的數組
$("div button:only-child") ：返回所有的div中只有唯一一個子節點的所有子節點的數組
（6） jquery表單對象屬性過濾選擇器
此選擇器主要對所選擇的表單元素進行過濾。
$(":enabled")：選擇所有的可操作的表單元素
$(":disabled")：選擇所有的不可操作的表單元素
$(":checked")：選擇所有的被checked的表單元素
$("select option:selected")：選擇所有的select 的子元素中被selected的元素
$(”input[@ name =S_03_22]“).parent().prev().text()：選取一個 name 爲”S_03_22″的input text框的上一個td的text值
$(”input[@ name ^='S_']“).not(”[@ name $='_R']“)：名字以”S_”開始，並且不是以”_R”結尾的
$(”input[@ name =radio_01][@checked]“).val();：一個名爲 radio_01的radio所選的值
$("A B")：查找A元素下面的所有子節點，包括非直接子節點
$("A>B") ：查找A元素下面的直接子節點
$("A+B") ：查找A元素後面的兄弟節點，包括非直接子節點
$("A~B") ：查找A元素後面的兄弟節點，不包括非直接子節點
4、jquery表單選擇器
利用表單選擇器我們可以極其方便地獲取表單的某個或某類型的元素。
注意：注意：要選取input中爲hidden值的方法就是上面例子的用法,但是直接使用 “:hidden” 的話就是匹配頁面中所有的不可見元素,包括寬度或高度爲0的。
$(":input") ：選擇所有的表單輸入元素，包括input, textarea, select 和 button
$(":text") ： 選擇所有的text input元素
$(":password")： 選擇所有的password input元素
$(":radio") ：選擇所有的radio input元素
$(":checkbox") ：選擇所有的checkbox input元素
$(":submit") ：選擇所有的submit input元素
$(":image") ： 選擇所有的image input元素
$(":reset") ：選擇所有的reset input元素
$(":button") ：選擇所有的button input元素
$(":file") ：選擇所有的file input元素
$(":hidden")：選擇所有類型爲hidden的input元素或表單的隱藏域