雖然近幾年隨著reactjs、vuejs等框架的流行，jquery使用的頻率不是很高了。但是如果維護一些舊專案還是存在大量使用jquery的地方。這裡總結一下jquery選擇器的各種寫法，以備不時之需。
選擇器描述
返回示例
#idid選擇器
單個元素
$("#canclebtn")選取id為canclebtn的元素
.class
樣式選擇器
集合元素
$(".test") 選取所有樣式為test的元素
element
標籤選擇器
集合元素
$(「div」) 選取所有的div元素
這三個是最基本也是最常用的。
通過dom元素之間的層次關係來獲取後代元素、子元素、相鄰元素、同輩元素等：
選擇器描述
返回示例
$(「s1 s2」)
後代選擇器(多個選擇器空格隔開)
集合元素
$(「div span」)選取div裡的所有span元素
$(「parent > child」)
子元素選擇器
集合元素
$(「div > span」)選取div元素下標籤名是span元素
(注意和後代選擇器的區別)
$(「prev + next」)
選取緊接在prev元素之後的next元素
集合元素
$(".one + span")選取class為one的下乙個
span同輩元素
$(「prev ~ siblings」)
選取prev元素之後的所有siblings元素
集合元素
$("#hm ~ div")選取id為hm之
後的所有div同輩元素
$("div span")等價於$("div").find("span")
$("div > span")等價於$("div").children("span")
$(".one + span")等價於$(".one").next("span")
$("#hm ~ div")等價於$("#hm").nextall("div")
1.基本過濾選擇器
選擇器描述
返回示例
:first
選取第乙個元素
單個元素
$(「div:first」)選取所有div元素中第1個div元素
:last
選取最後乙個元素
單個元素
$(「div:last」)選取所有div元素中最後乙個div元素
:not(selector)
去除所有與給定選擇
器匹配的元素
集合元素
$(「input:not(.myclass)」)選取class不是
myclass的所有div元素
:even
選取索引是偶數的元素
集合元素
$(「input:even」)選取索引是偶數的元素
:odd
選取索引是奇數的元素
集合元素
$(「input:odd」)選取索引是奇數的元素
:eq(index)
選取索引等於index的元素
單個元素
$(「input:eq(1)」)選取索引等於1的元素
:gt(index)
選取索引大於index的元素
集合元素
$(「input:gt(1)」)選取索引大於1的元素
:lt(index)
選取索引小於index的元素
集合元素
$(「input:gt(1)」)選取索引小於1的元素
:header
選取所有的標題元素
集合元素
$(":header")選取網頁中的所有、、選擇器
描述:input
選取所有input、textarea、select、button元素
:text
選取所有的單行文字框
:password
選取所有的密碼框
:radio
選取所有的單選框
:checkbox
選取所有的多選框
:submit
選取所有的提交按鈕
:image
選取所有的影象按鈕
:reset
選取所有的重置按鈕
:button
選取所有的按鈕
:file
選取所有的上傳域
:hidden
選取所有不可見元素
注：以上摘自之前閱讀《jquery基礎教程》的讀書筆記，最近遇到專案中使用jquery選擇器的地方，又翻出來看看，比較容易搞混的是後代選擇器$(".class1 .class2 .class3") 和 選擇同時滿足多個樣式的元素$(".class1.class2.class3")；如果同時使用多個選擇器逗號相隔$(".class1,.class2")。
jQuery選擇器小結
學習jquery首當其衝的就是要學習jquery的選擇器，同時還要區分jquery物件與dom物件的區別 下面小猿就來簡單小結一下jquery選擇器 1.基本選擇器 one css background bbffaa mini css background bbffaa div css backgr...
Jquery選擇器小結
1 id id選擇器 2 div 元素選擇器 3 classname 類選擇器 4 classname,classname1,id1 組合選擇器 id classname 子元素選擇器 id classname 後代元素選擇器 id classname 緊鄰下乙個元素選擇器 id classname...
jQuery八種選擇器小結
一 基礎選擇器 根據指定的id匹配對應的元素 btn1 click function 如果控制項id值中含有特殊符號，在選擇器中可以使用 來解析 btn 1 click function 根據標籤名稱匹配指定的標籤 input click function 根據指定的類名來匹配元素 cls1 css...