一、 基本過濾選擇器
基本過濾選擇器重要包括:
:first 、:last、:not(selector) 、:even、:odd、:eq(index)、:gt(index)、:lt(index)、:header、:animated
二、 內容過濾選擇器
:contains(text)選取含有文本內容爲text的元素
$("div:contains('John')") 選取內容包含John的div元素
:empty 選取不包含子元素或者文本的空元素
$("td:empty") 選擇不含子元素或者文本的td
:has(selector)選取含有選擇器匹配的元素的元素
eg:$("div:has(p)").addClass("test");選擇有p元素的div,並給其增加class屬性,值爲test
:parent 選取含有子元素或者文本德元素
eg:$("td:parent") 選擇有子元素或者文本的單元格
三、 可見性過濾選擇器
:hidden 匹配所有的不可見元素,input 元素的 type 屬性爲 "hidden" 的話也會被匹配到
$("tr:hidden") 選擇所有style中display爲none即不可見的tr
注意hidden不僅包括樣式屬性的display爲none的元素,也包括文本隱藏域和visible=hidden等的元素。通過show方法可以讓其變爲顯示元素。所以我們要設置隱藏的特效,需要在執行show方法之前設定。
:visible 匹配所有的可見元素
$("tr:visible") 選擇style中display不爲none即可見的tr
四、 屬性過濾選擇器
[attribute=value] 匹配所有含有指定的屬性,但屬性等於特定值的元素。
[attribute!=value] 匹配所有含有指定的屬性,但屬性不等於特定值的元素。
[attribute^=value] 匹配給定的屬性是以某些值開頭的元素
[attribute$=value] 匹配給定的屬性是以某些值結尾的元素
[attribute*=value] 匹配給定的屬性是以包含某些值的元素
[attribute] 匹配包含給定屬性的元素
[selector1][selector2][selectorN] 複合屬性選擇器,需要同時滿足多個條件時使用。
eg:$("input[id][name$='man']") 含有id屬性卻name屬性以man結尾的input元素
五、 子元素過濾選擇器·
:first-child 匹配第一個子元素
eg:每個class爲one的div元素下的第2個子元素 $("div.one :first-child")
:last-child 匹配最後一個子元素
eg:每個class爲one的div元素下的第1個子元素 $("div.one :last-child")
:nth-child(index/even/odd/equation) 匹配其父元素下的第N個子或奇偶元素
eg:每個class爲one的div元素下的最後1個子元素 $("div.one :nth-child(2)")
:only-child 如果某個元素是父元素中唯一的子元素,那將會被匹配
eg:每個class爲one的div元素下只有1個元素的 $("div.one :only-child")
六、 表單對象過濾選擇器
:checked 匹配所有選中的被選中元素(複選框、單選框等,不包括select中的option)
:selected 匹配所有選中的option元素
:disabled 匹配所有不可用元素
:enabled 匹配所有可用元素