jQuery筆記(二)之選擇器

2021-09-30 08:42:36 字數 2276 閱讀 9244

#id.class

element

*selector1, selector2, ……, selectorn

$("ancestor descendant")
選取ancestor元素裡的所有descendant後代元素

$("parent > child")
選取parent元素下的child元素

$('prev + next')
選取緊接在prev元素後的next元素。代替方法:

$('prev').next('next')

$('prev ~ siblings')
選取prev元素之後的所有siblings元素。代替方法:

$('prev').nextall('siblings')

1、基本過濾選擇器

:first

選取第乙個元素

:last

選取最後乙個元素

:not(selector)

去除所有與給定選擇器匹配的元素

:even

選擇索引是偶數的所有元素,索引從0開始

:odd

選取索引是奇數的所有元素,索引從0開始

:eq(index)

選取索引等於index的元素

:gt(index)

選取索引大於index的元素

:lt(index)

選取索引小於index的元素

:header

選取所有的標題元素,例如h1,h2,h3等等

:animated

選取當前正在執行動畫的所有元素

2、內容過濾選擇器

:contains(text)

選取含有文字內容為「text」的元素

:empty

選取不包含子元素或者文字的空元素

:has(selector)

選取含有選擇器所匹配的元素的元素

:parent

選取含有子元素或者文字的元素

3、可見性過濾選擇器

:hidden

選取所有不可見的元素

:visible

選取所有可見的元素

4、屬性過濾選擇器

[attribute]

選取擁有此屬性的元素

[attribute=value]

選取屬性的值為value的元素

[attribute!=value]

選取屬性的值不等於value的元素

[attribute^=value]

選取屬性的值以value開始的元素

[attribute$=value]

選取屬性的值以value結束的元素

[attribute*=value]

選取屬性的值含有value的元素

[selector1][selector2][selectorn]

用屬性選擇器合併成乙個符合屬性選擇器,滿足多個條件,每選擇一次,縮小一次範圍

5、子元素過濾選擇器

:nth-child(index/even/odd/equation)

選取每個父元素下的第index個子元素或者奇偶元素。(index從1算起)

:first-child

選取每個父元素的第1哥子元素

:last-child

選取每個父元素的最後乙個子元素

:only-child

如果每個元素是它父元素中唯一的子元素,那麼將會被匹配。如果父元素中含有其他元素,則不會被匹配。

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

:enabled

選取所有可用元素

:disabled

選取所有不可用元素

:checked

選取所有被選中的元素(單選框、核取方塊)

:selected

選取所有被選中的選項元素(下拉列表)

:input

選取所有的、、和元素

:text

選取所有的單行文字框

:password

選取所有的密碼框

:radio

選取所有的單選框

:checkbox

選區所有的核取方塊

:submit

選取所有的提交按鈕

:image

選取所有的影象按鈕

:reset

選取所有的重置按鈕

:button

選取所有的按鈕

:file

選取所有的上傳域

:hidden

選取所有不可見元素

jQuery筆記 選擇器 二

1.選擇器練習 1 查詢ul中的元素的內容格式 ul li xx text xx 代表方法 比如 獲取到第一元素,然後獲取當中的值 ul li first text 獲取最後乙個元素,然後獲取當中的值 ul li last text 查詢索引號是奇數的標籤,索引號從1開始 ul li odd siz...

jQuery學習筆記二 選擇器

選擇器是jquery的核心,它幫助我們快速定位到乙個或多個dom節點。查詢 var div abc abc以 開頭。返回的物件是jquery物件。jquery物件類似陣列,它的每個元素都是乙個引用了dom節點的物件。如果id為abc的存在,返回的jquery物件如下 abc 如果id為abc的不存在...

jQuery筆記之基本選擇器

工欲善必先利其器,乙個好的開發工具可以讓你起到事半功倍的效果。可以進官網下最新版本同時也要到jquery官網咖最新版本的jquery下下來 jquery選擇器功能強大,種類也很多,分類 類 css選擇器 基本選擇器 層次選擇器 屬性選擇器 過濾選擇器 基本過濾選擇器 可見性過濾選擇器 基本選擇器 包...