學習 jQuery 5 篩選和過濾器

2021-09-05 19:15:30 字數 2683 閱讀 1112

使用基本的過濾器

:first              第乙個匹配的元素

:last               最後乙個匹配的元素

:even             匹配的序號為偶數

:odd              匹配的序號為奇數

例如:設定**所有的偶數行的背景色

$("tr:even").css

("background-color", "#bbbbff");

設定**所有奇數行的背景色

$("tr:odd").css

("background-color", "#bbbbff");

設定斑馬線**

$("tr:even").css

("background-color", "#e7e7ff");

$("tr:odd").css

("background-color", "#f7f7f7");

:not( 表示式 )          從匹配的集合中刪除所有符合表示式的元素

例如:選擇緊接在沒有被選中的核取方塊的後面的 lable ,將其背景色設定為黃色

$("input:not(:checked

) + span").css

("background-color", "yellow");

:eq                匹配元素在匹配集合中的索引號等於指定值的元素

:lt                  匹配元素在匹配集合中的索引號小於指定值的元素

:gt                 匹配元素在匹配集合中的索引號大於指定值的元素

例如:將前 4 個格的顏色設定為紅色

$("td:lt(4)").css

("color", "red");

:header         匹配標題行,例如 h1, h2, h3 ……

例如:

設定所有標題的背景色,前景色

$(":header").css()

針對表單的篩選

:text                   

匹配所有的

type

為text

的輸入項

例如:將表單中所有

type

為text

的輸入項的背景色設定為紅色

$(":text")").css()

:checkbox           

匹配所有

type

為checkbox

的輸入項

例如:將頁面中所有的核取方塊設定為選中狀態

$(":checkbox").each( function( ) );

其它:input                  

匹配所有

input 元素

:text                   

匹配所有

type

為text

的輸入項

:checkbox           

匹配所有

type

為checkbox

的輸入項

:password           

匹配所有

type

為password

的輸入項

:radio                  

匹配所有

type

為radio

的輸入項

:submit              

匹配所有

type

為submit

的輸入項

:image                 

匹配所有

type

為image

的輸入項

:reset                   

匹配所有

type

為reset

的輸入項

:button                

匹配所有

type

為button

的輸入項

:file                    

匹配所有

type

為file

的輸入項

:hidden               

匹配所有

type

為hidden

的輸入項

針對輸入項狀態的條件

:enabled              

匹配所有

type

為hidden

的輸入項

:disabled             

匹配所有被禁用的元素

:checked             

匹配所有被選中的單選框和核取方塊

:selected            

匹配所有被選中的元素

示例將所有被禁用的元素背景設定為灰色

$("input:disabled").css()

jq常用過濾器 jquery 過濾器

1.基本選擇器 基本選擇器是jquery中最常用的選擇器,也是最簡單的選擇器,它通過元素id class 和標籤名來查詢dom元素。這個非常重要,下面的內容都是以此為基礎,逐級提高的。1 id 獲取id指定的元素,id是全域性唯一的,所以它只有乙個成員。2 class 獲取class指定的元素,不同...

JQuery選擇過濾器

jquery選擇器 選擇器與選擇器之間要加空格,選擇器與過濾器之間不需要加空格。1.基本選擇器 1 id id選擇器 2 element 標籤選擇器 3 class 類選擇器 4 選擇所有元素 5 selector1,selector2 多條件選擇器 例如 div,span,myclass 表示選擇...

Jquery基本過濾器

1 改變樣式方法 css 方法,兩個引數。第乙個要改變的屬性名稱,第二個是其屬性值。比如 div1 css background yellow 2 基本過濾器。first選取第一1個元素。div first last選取最後乙個元素。div last not選取不滿足 選擇其 條件的元素。input...