Jquery 過濾選擇器大全

2021-06-30 16:32:30 字數 2059 閱讀 4365

過濾選擇器主要是通過特定的過濾規則來篩選出所需的 dom 元素,該選擇器都以 「:」 開頭

按照不同的過濾規則, 過濾選擇器又可分為基本過濾, 內容過濾, 可見性過濾, 屬性過濾, 子元素過濾和表單物件屬性過濾選擇器

基本過濾

改變第乙個 div 元素的背景色為 # bbffaa

$("div:first")

改變id不為 one 的所有p元素的背景色為 # bbffaa

$("p:not('#one')")

改變索引值為偶數的 tr元素的背景色為 # bbffaa

$(「tr:even")

改變索引值為大於 3 且為奇數的 p元素的背景色為 # bbffaa

$(「p:gt(3):odd")

改變所有的標題元素的背景色為 # bbffaa

$(":header")

改變當前正在執行動畫的所有元素的背景色為 # bbffaa

內容過濾,內容過濾選擇器的過濾規則主要體現在它所包含的子元素和文字內容上

改變含有文字 『di』 的 p元素的背景色為 # bbffaa

$("p:cotains(di)")

改變不包含子元素(或者文字元素) 的 div 空元素的背景色為 # bbffaa

改變含有 class 為 mini 元素的 p元素的背景色為 # bbffaa

$("p:has(.mini)")

改變含有子元素(或者文字元素)的div元素的背景色為 # bbffaa

可見性過濾,可見性過濾選擇器是根據元素的可見和不可見狀態來選擇相應的元素

可見選擇器:hidden 不僅包含樣式屬性 display 為 none 的元素, 也包含文字隱藏域 ()和 visible:hidden 之類的元素

屬性過濾

屬性過濾選擇器的過濾規則是通過元素的屬性來獲取相應的元素

子元素過濾

nth-child() 選擇器詳解如下:

(1) :nth-child(even/odd): 能選取每個父元素下的索引值為偶(奇)數的元素

(2):nth-child(2): 能選取每個父元素下的索引值為 2 的元素

(3):nth-child(3n): 能選取每個父元素下的索引值是 3 的倍數 的元素

(3):nth-child(3n + 1): 能選取每個父元素下的索引值是 3n + 1的元素

表單物件屬性過濾

表單元素選擇器

jQuery過濾選擇器 基本過濾選擇器

過濾選擇器主要是通過特定的過濾規則來篩選出所需的dom元素,過濾規則與css中的偽類選擇器語法相同,即選擇器都以乙個冒號 開頭。按照不同的過濾規則,過濾選擇器可以分為基本過濾 內容過濾 可見性過濾 屬性過濾 子元素過濾和表單物件屬性過濾選擇器。基本過濾選擇器 選擇器 描述 返回 示例 first 選...

jQuery過濾選擇器 基本過濾選擇器

過濾選擇器主要是通過特定的過濾規則來篩選出所需的dom元素,過濾規則與css中的偽類選擇器語法相同,即選擇器都以乙個冒號 開頭。按照不同的過濾規則,過濾選擇器可以分為基本過濾 內容過濾 可見性過濾 屬性過濾 子元素過濾和表單物件屬性過濾選擇器。基本過濾選擇器 選擇器 描述 返回 示例 first 選...

jQuery過濾選擇器

基本過濾選擇器 first 選取第乙個元素 last 選取最後乙個元素 not selector 去除所有與給定選擇器匹配的元素 even 選取索引是偶數的所有元素,索引從0開始 odd 選取索引是奇數的所有元素,索引從0開始 eq index 選取索引等於index的元素 index從0開始 gt...