jQuery 過濾選擇器

2022-06-14 12:33:10 字數 2018 閱讀 7654

4、過濾選擇器

過濾選擇器主要是通過特定的過濾規則來篩選出所需的dom元素,過濾規則與css

中的偽類選擇器語法相同,即選擇器都以乙個冒號(:)開頭。按照不同的過濾規則,

過濾選擇器可以分為基本過濾、內容過濾、可見性過濾、屬性過濾、子元素過濾和表

單物件屬性過濾選擇器。

1)基本過濾選擇器

:first、:last、

:not(selector)【去除所有與給定選擇器匹配的元素eg.$("input:not(.mybox)")

選取class不是mybox的input元素】、

:even【索引值是偶數,0開始】、

:odd【索引值是奇數,0開始】、

:eq(index)【選取指定索引值的元素】、

eg.$("ul li:eq(1)")獲取li裡的第二個節點;

$("ul li:eq(0)").text();獲取元素的第乙個節點的文字;

:gt(index)【選取索引大於index的元素,0開始】、

:lt(index)【選取索引小於index的元素,0開始】

:header【選取所有的標題元素,如h1~h6】、

:animation【選取當前正在執行動畫的所有元素】

2)內容過濾選擇器:過濾規則主要體現在它所包含的子元素或文字內容上。

:contains(text)【選取文字內容為「text」的元素,eg.$("div:contains('我

的')")】

:empty【選取不包含子元素或文字的空元素】

:has(selector)【選取含有選擇器所匹配的元素的元素】

:parent【選取含有子元素或文字的元素】

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

應的元素。

:hidden【選取所有不可見的元素】

$(":hidden")等價於 $("input:hidden"),,

style="visibility:hidden;">

:visible【選取所有可見的元素】 $("div:visible")

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

。)[attribute]【選取擁有此屬性的元素】$("div[id]")

[attribute=value]【選取屬性值為value的元素】$("div[title=test]")

[attribute!=value]【選取屬性值不等於value的元素】$("div[title!=test]")

[attribute^=value]【選取屬性值以value開始的元素】$("div[title^=test]")

[attribute$=value]【選取屬性值以value結束的元素】$("div[title$=test]")

[attribute*=value]【選取屬性值含有value值的元素】$("div[title*=test]")

[selector1][selector2][selectorn]【用屬性選擇器合併成乙個復合的屬性選擇器

,滿足多個條件,每選擇一次,縮小一次範圍】

$("div[id][titlt$='test']"):選取有屬性id且屬性title以test結束的div元素

5)子元素過濾選擇器(關鍵:將元素的父元素和子元素區分清楚,)

:nth-child(index/even/odd/equation)【選取每個父元素下的第index個子元素或

奇偶元素,index從1算起】

:first-child【選取每個父元素的第1個子元素】

:last-child【選取每個父元素的最後乙個子元素】

:only-child【若某個元素是它的父元素中唯一的子元素,則會被匹配,若含有其他

元素則不會被匹配】

6)表單物件屬性過濾選擇器

:enabled【選取所有可用元素】

:disabled【選取所有不可用元素】

:checked【選取所有被選中元素,單選或核取方塊】

:selected【選取所有被選中的選項元素,下拉列表】

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

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

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

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

jQuery過濾選擇器

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