根據所獲取頁面中元素的不同,可以將jquery選擇器分為四大類:基本選擇器、層次選擇器、過濾選擇器、表單選擇器。其中在過濾選擇器中又可分為:簡單過濾選擇器、內容過濾選擇器、可見性過濾選擇器、屬性過濾選擇器、子元素過濾選擇器、表單物件屬性過濾選擇器。
它由元素id、元素名、多個選擇符組成,通過基本選擇器可以實現大多數頁面元素的查詢。
選擇器功能描述
返回值#id
根據給定的id匹配乙個元素
單個元素
element
根據給定的元素名匹配所有元素
元素集合
.class
根據給定的類匹配元素
元素集合
*
匹配所有元素
元素集合
selector1,selectorn
將每乙個選擇器匹配到元素合併後一起返回
元素集合
示例:
idclass
span
層次選擇器通過dom元素間的層次關係獲取元素,其主要的層次關係包括後代、父子、相鄰、兄弟關係,通過其中某類關係可以方便快捷地定位元素。
選擇器功能描述
返回值ancestor descendant
根據祖先元素匹配所有的後代元素
元素集合
parent>child
根據父元素匹配所有的子元素
元素集合
prev +next
匹配所有緊接在prev元素後的相鄰元素
元素集合
pre~siblings
匹配pre元素之後的所有兄弟元素
元素集合
示例:
idclass
span
過濾選擇器根據某類過濾規則進行元素的匹配,書寫時都以冒號(:)開頭;簡單過濾選擇器是過濾選擇器中過濾選擇中使用最廣泛的一種
選擇器功能描述
返回值first()或 :first
獲取第乙個元素
單個元素
last()或 :last
獲取最後乙個元素
單個元素
:not(selector)
獲取除給定選擇器外的所有元素
元素集合
:even
獲取所有索引值為偶數的元素,索引號從0開始
元素集合
:odd
獲取所有索引值為奇數的元素,索引號從0開始
元素集合
:eq(index)
獲取指定索引值的元素,索引號從0開始
單個元素
:gt(index)
獲取所有大於給定索引值的元素,索引號從0開始
元素集合
:lt(index)
獲取所有小於給定索引值的元素,索引號從0開始
元素集合
:header
獲取所有標題型別的元素,如h1、h2...... 元素集合
元素集合
:animated
獲取正在執行動畫效果的元素
元素集合
示例:
span move
內容過濾選擇器根據元素中的文字內容或所包含的子元素特徵獲取元素,其文字內容可以絕對模糊或絕對匹配進行元素定位
選擇器功能描述
返回值:contains(text)
獲取包含給定文字的元素
元素集合
:empty
獲取所有不包含子元素或者文字的空元素
元素集合
:has(selector)
獲取含有選擇器所匹配的元素
元素集合
:parent
獲取含有子元素或者文字的元素
元素集合
可見性過濾選擇器根據元素是否可見的特徵獲取元素
選擇器功能描述
返回值:hidden
獲取所有不可見元素,或者type為hidden的元素
元素集合
:visble
獲取所有的可見元素
元素集合
屬性過濾器根據元素的某個屬性獲取元素,如id號或匹配屬性值的內容,並以「[」號開始、一"]"號結束
選擇器功能描述
返回值[attribute]
獲取包含給定屬性的元素
元素集合
[attribute=value]
獲取等於給定的屬性是某個特定值的元素
元素集合
[attribute!=value]
獲取不等於給定的屬性是某個特定值的元素
元素集合
[attribute^=value]
獲取給定的屬性是以某些值開始的元素
元素集合
attribute$=value]
]獲取給定的屬性是以某些值結束的元素
元素集合
[attribute*=value]
獲取給定的屬性是以包含某些值的元素
元素集合
[selector1][selector2][selectorn]
獲取滿足多個條件的符合屬性的元素
元素集合
在頁面開發過程中,嚐嚐遇到突出指定某行的需求。雖然使用基本過濾選擇器「:eq(index)"可實現單個**的顯示,但不能滿足大量資料和多個**的選擇需求。為了實現這樣的功能,jquery中可以通過子元素過濾選擇器輕鬆獲取所有父元素中的某個元素。
選擇器選擇器
返回值:nth-child(eq|even|odd|index)
獲取每個父元素下的特定位置元素,索引號從1開始
元素集合
:first-child
獲取每個父元素下的第一子元素
元素集合
:last-child
獲取每個父元素下的最後乙個子元素
元素集合
:only-child
獲取每個父元素下的僅有乙個子元素
元素集合
表單物件屬性過濾選擇器通過表單中的某物件屬性特徵獲取該元素,如enabled、disabled、checked、selected屬性。
選擇器功能描述
返回值:enabled
獲取表單中所有屬性為可用的元素
元素集合
:disabled
獲取表單中素有屬性為不可用的元素
元素集合
:checked
獲取表單中所有被選中的元素
元素集合
:selected
獲取表單中所有被選中option的元素
元素集合
在jquery選擇器中引入表單選擇器,該選擇器專為表單量身打造,通過它可以在頁面中快速定位某表單物件。
選擇器功能描述
返回值:input
獲取所有input、textarea、select
元素集合
:text
獲取所有單行文字框
元素集合
:password
獲取所有密碼框
元素集合
:radio
獲取所有單選按鈕
元素集合
:checkbox
獲取核取方塊
元素集合
:submit
獲取所有提交按鈕
元素集合
:image
獲取所有影象域
元素集合
:reset
獲取所有重置按鈕
元素集合
:button
獲取所有按鈕
元素集合
:file
獲取所有檔案域
元素集合
jQuery選擇器型別
jquery選擇器應該是學習jquery的最基本的知識了,下面介紹一下各個型別的選擇器的怎麼寫。1 基本選擇器 這是最常用的選擇器 id 根基給定的id匹配乙個元素 class 根據類名匹配元素 element 直接寫出標籤名,根據給定的元素名匹配元素 萬用字元 selector1,selector...
jQuery學習 選擇器
首先了解一下css選擇器,css即層疊樣式表他將網頁結構和表現樣式完全分離出來,利用css選擇器可以輕鬆在不改變html結構的前提下改變樣式。他是利用獲取目標元素後施加樣式,有三種方式 行間樣式表 內部樣式表 外部樣式表。選擇器語法 描述示例 標籤選擇器 e以標籤作為選擇符 tdid選擇器 id以文...
jquery選擇器學習
學習方式,照著列表乙個個敲一遍,記個大概,知道有這麼個選擇器.之後使用的時候查查w3c,就會用了 p 取得p標籤 p1 取得id為p1的元素 p1 取得class p1的元素 href 選擇屬性帶有href的元素 href 選擇href 的元素 href 選擇href 的元素 選擇所有href屬性以...