簡單案例:
$(function(){ $("td[id][id!='']").click(function(){ //你的逻辑 }); });
上述程式碼,有id且id不為空的td都會執行「你的邏輯」。
=======================轉載====================== ===
1、eq() 篩選指定索引號的元素
2、first() 篩選出第一個符合的元素
3、last() 篩選出最後一個符合的元素
4、hasClass() 檢查匹配的元素是否含有指定的類別
5、filter() 篩選出與指定表達式匹配的元素集合
6、is() 檢查元素是否參數裡能符合上的
7、map()
8、has() 篩選出包含指定子元素的元素
9、not() 排除能夠被參數中匹配的元素
10、slice( ) 從指定索引開始,截取指定個數的元素
11、children() 篩選取得指定元素的資源
12、closest() 從目前元素開始,傳回最先符合到的符合條件的父元素
13、find() 從指定元素中尋找子元素
14、next() 取得指定元素的下一個兄弟元素
15、nextAll() 取得其後的所有兄弟元素
16 、nextUntil() 取得其後的元素,直到參數能匹配上的為止,不包括結束條件那個
17、offsetPosition() 傳回第一個用於定位的祖先元素,即查找祖先元素中position為relative或absolute的元素。
18、parent() 取得所有指定元素的直接父元素
19、parents() 取得所有指定元素的祖先元素,一直到6c04bd5ca3fcae76e30b72ad730ca86d36cc49f0c466276486e50c850b7e4956
20、parentstiltil()取得指定元素的祖先元素,知道參數裡能匹配到的為止
21、prev() 獲取指定元素的前一個兄弟元素
22、prevAll() 獲取指定元素前面的所有兄弟元素
23、prevUntil() 取得指定元素前面的所有兄弟元素,直到參數裡的條件能夠匹配到的。 注意參數條件本身不會被符合
24、siblings() 取得指定元素的兄弟元素,不分前後
25、add() 將選取的元素加入jQuery物件集合中
26、andSelf () 將自身加到選取的jQuery集合中,以方便一次性操作
27、end() 將改變目前選擇器選取的操作回退為上一個狀態。
28、contents 不懂
************************* 篩選********** **************************
一、eq() 篩選指定索引號的元素
語法:eq(index|-index) 索引號從0開始,若為負值,則從最後一個開始倒數,最後一個從-1開始
$("p").eq(1); //如果选择器改为 $("p").eq(-1),则我是第四个P会被选中 e388a4556c0f65e1904146cc1a846bee e388a4556c0f65e1904146cc1a846bee我是第一个P94b3e26ee717c64999d7867364b1b4a3 e388a4556c0f65e1904146cc1a846bee我是第二个P94b3e26ee717c64999d7867364b1b4a3 //会被选中,索引值为1 e388a4556c0f65e1904146cc1a846bee我是第三个P94b3e26ee717c64999d7867364b1b4a3 e388a4556c0f65e1904146cc1a846bee我是第四个P94b3e26ee717c64999d7867364b1b4a3 94b3e26ee717c64999d7867364b1b4a3
語法:first() 此方法沒有參數
$("p").first(); e388a4556c0f65e1904146cc1a846bee e388a4556c0f65e1904146cc1a846bee我是第一个P94b3e26ee717c64999d7867364b1b4a3 //我的索引值是0,我是第一个,我会被选中 e388a4556c0f65e1904146cc1a846bee我是第二个P94b3e26ee717c64999d7867364b1b4a3 e388a4556c0f65e1904146cc1a846bee我是第三个P94b3e26ee717c64999d7867364b1b4a3 e388a4556c0f65e1904146cc1a846bee我是第四个P94b3e26ee717c64999d7867364b1b4a3 94b3e26ee717c64999d7867364b1b4a3
語法:last() 此方法沒有參數
$("p").last(); e388a4556c0f65e1904146cc1a846bee e388a4556c0f65e1904146cc1a846bee我是第一个P94b3e26ee717c64999d7867364b1b4a3 e388a4556c0f65e1904146cc1a846bee我是第二个P94b3e26ee717c64999d7867364b1b4a3 e388a4556c0f65e1904146cc1a846bee我是第三个P94b3e26ee717c64999d7867364b1b4a3 e388a4556c0f65e1904146cc1a846bee我是第四个P94b3e26ee717c64999d7867364b1b4a3 //我是最后一个,我会被选中 94b3e26ee717c64999d7867364b1b4a3
語法:hasClass(class) class為類別名稱//傳回布林值
if($("p").hasClass("p2")) { alert("我里面含有class=p2的元素"); //会弹出,p里的确存在class="p2"的元素 } e388a4556c0f65e1904146cc1a846bee e388a4556c0f65e1904146cc1a846bee我是第一个P94b3e26ee717c64999d7867364b1b4a3 25fdd61924ec43f68f6d130ac257deb1我是第二个P94b3e26ee717c64999d7867364b1b4a3 e388a4556c0f65e1904146cc1a846bee我是第三个P94b3e26ee717c64999d7867364b1b4a3 e388a4556c0f65e1904146cc1a846bee我是第四个P94b3e26ee717c64999d7867364b1b4a3 94b3e26ee717c64999d7867364b1b4a3
語法:filter(expr|obj |ele|fn) expr:匹配表達式|obj:jQuery對象,用於匹配現有元素| DOM:用於匹配的DOM元素| function返回值作為匹配條件
$("p").filter(".p2"); e388a4556c0f65e1904146cc1a846bee e388a4556c0f65e1904146cc1a846bee我是第一个P94b3e26ee717c64999d7867364b1b4a3 25fdd61924ec43f68f6d130ac257deb1我是第二个P94b3e26ee717c64999d7867364b1b4a3 //我会被选中,我的class="p2" e388a4556c0f65e1904146cc1a846bee我是第三个P94b3e26ee717c64999d7867364b1b4a3 e388a4556c0f65e1904146cc1a846bee我是第四个P94b3e26ee717c64999d7867364b1b4a3 94b3e26ee717c64999d7867364b1b4a3
語法:is(expr |obj|ele|fn) expr:匹配表達式|obj:jQuery對象,用於匹配現有元素| DOM:用於匹配的DOM元素| function返回值作為匹配條件
$($("p").first().is(".p2")) { alert("不会弹出,因为第一个P的class不等于p2"); } e388a4556c0f65e1904146cc1a846bee e388a4556c0f65e1904146cc1a846bee我是第一个P94b3e26ee717c64999d7867364b1b4a3 25fdd61924ec43f68f6d130ac257deb1我是第二个P94b3e26ee717c64999d7867364b1b4a3 //我会被选中,我的class="p2" e388a4556c0f65e1904146cc1a846bee我是第三个P94b3e26ee717c64999d7867364b1b4a3 e388a4556c0f65e1904146cc1a846bee我是第四个P94b3e26ee717c64999d7867364b1b4a3 94b3e26ee717c64999d7867364b1b4a3
七、map ()
八、has() 篩選出包含指定子元素的元素
語法:has(expr|ele) expr:選擇表達式| DOM元素選擇
$("p").has("p"); e388a4556c0f65e1904146cc1a846bee //本p会被选中,因为该p含有p子元素 e388a4556c0f65e1904146cc1a846bee我是第一个P94b3e26ee717c64999d7867364b1b4a3 25fdd61924ec43f68f6d130ac257deb1我是第二个P94b3e26ee717c64999d7867364b1b4a3 e388a4556c0f65e1904146cc1a846bee我是第三个P94b3e26ee717c64999d7867364b1b4a3 e388a4556c0f65e1904146cc1a846bee我是第四个P94b3e26ee717c64999d7867364b1b4a3 94b3e26ee717c64999d7867364b1b4a3 e388a4556c0f65e1904146cc1a846bee 45a2772a6b6107b401db3c9b82c049c2我是一个span5d8d27040b30e9f46281915572ea3452 94b3e26ee717c64999d7867364b1b4a3
九、not() 排除能夠被參數中匹配的元素
語法:not(expr|ele|fn) expr:選擇表達式| DOM元素選擇| fn的作用還不清楚
$("p").not(".p2"); e388a4556c0f65e1904146cc1a846bee e388a4556c0f65e1904146cc1a846bee我是第一个P94b3e26ee717c64999d7867364b1b4a3 //会被选中,没有class=p2 25fdd61924ec43f68f6d130ac257deb1我是第二个P94b3e26ee717c64999d7867364b1b4a3 //不会被选中,因为有class=p2被not(".p2")排除了 e388a4556c0f65e1904146cc1a846bee我是第三个P94b3e26ee717c64999d7867364b1b4a3 //会被选中,没有class=p2 e388a4556c0f65e1904146cc1a846bee我是第四个P94b3e26ee717c64999d7867364b1b4a3 //会被选中,没有class=p2 94b3e26ee717c64999d7867364b1b4a3
十、slice() 從指定索引開始,截取指定個數的元素
語法:slice(start, [end]) start位置, end可選,結束位置,不包含結束位置那個位置。如果不指定,則符合到最後一個。
$("p").slice(1,3) e388a4556c0f65e1904146cc1a846bee e388a4556c0f65e1904146cc1a846bee我是第一个P94b3e26ee717c64999d7867364b1b4a3 //不会被选中,我索引为0 25fdd61924ec43f68f6d130ac257deb1我是第二个P94b3e26ee717c64999d7867364b1b4a3 //会被选中,我索引为1 e388a4556c0f65e1904146cc1a846bee我是第三个P94b3e26ee717c64999d7867364b1b4a3 //会被选中,我索引为2 e388a4556c0f65e1904146cc1a846bee我是第四个P94b3e26ee717c64999d7867364b1b4a3 //不会被选中,虽然我的索引为3,但是不包括我 94b3e26ee717c64999d7867364b1b4a3
********************** 篩選******************** *************
十一、children() 篩選取得指定元素的資源
# 語法:children(expr); 取得指定元素的資源, expr為子元素篩選條件
$("p").children(".p2"); e388a4556c0f65e1904146cc1a846bee e388a4556c0f65e1904146cc1a846bee我是第一个P94b3e26ee717c64999d7867364b1b4a3 //不会被选中,虽然我是p的子元素,但是我没class=p2 25fdd61924ec43f68f6d130ac257deb1我是第二个P94b3e26ee717c64999d7867364b1b4a3 //会被选中,我既是p的子元素,又有class=p2 e388a4556c0f65e1904146cc1a846bee我是第三个P94b3e26ee717c64999d7867364b1b4a3 //不会被选中,虽然我是p的子元素,但是我没class=p2 e388a4556c0f65e1904146cc1a846bee我是第四个P94b3e26ee717c64999d7867364b1b4a3 //不会被选中,虽然我是p的子元素,但是我没class=p2 94b3e26ee717c64999d7867364b1b4a3
十二、closest() 從當前元素開始,返回最先匹配到的符合條件的父元素
$("span").closest("p","p"); e388a4556c0f65e1904146cc1a846bee //不会被选中,被P抢了先机 e388a4556c0f65e1904146cc1a846bee我是第一个P //P会被选中,因为P符合条件,而且是最先匹配到的,虽然p也符合条件了,但是p不是最先匹配到的。因此p不会被选中。 45a2772a6b6107b401db3c9b82c049c2我是P里的span54bdf357c58b8a65c66d7c19c8e4d114 94b3e26ee717c64999d7867364b1b4a3 94b3e26ee717c64999d7867364b1b4a3
十三、find() 從指定元素中尋找子元素
語法:find(expr|obj|ele) expr:匹配表達式| obj用於匹配的jQuery物件| DOM元素
$("p").find(".p2"); e388a4556c0f65e1904146cc1a846bee e388a4556c0f65e1904146cc1a846bee我是第一个P94b3e26ee717c64999d7867364b1b4a3 //不会被选中,虽然我是p的子元素,但是我没class=p2 25fdd61924ec43f68f6d130ac257deb1我是第二个P94b3e26ee717c64999d7867364b1b4a3 //会被选中,我既是p的子元素,又有class=p2 e388a4556c0f65e1904146cc1a846bee我是第三个P94b3e26ee717c64999d7867364b1b4a3 //不会被选中,虽然我是p的子元素,但是我没class=p2 e388a4556c0f65e1904146cc1a846bee我是第四个P94b3e26ee717c64999d7867364b1b4a3 //不会被选中,虽然我是p的子元素,但是我没class=p2 94b3e26ee717c64999d7867364b1b4a3
十四、next()取得指定元素的下一個兄弟元素
語法:next(expr) expr:可選,篩選條件,如果下一個兄弟元素不符合改變條件,則傳回空。
$(".p2").next(); //如果筛选改为$(".p2").next(".p4")那选中的是哪个呢?答案是:没选中任何元素,因为虽然有个class=p4的P,但它不是.p2的下一个。 e388a4556c0f65e1904146cc1a846bee e388a4556c0f65e1904146cc1a846bee我是第一个P94b3e26ee717c64999d7867364b1b4a3 25fdd61924ec43f68f6d130ac257deb1我是第二个P94b3e26ee717c64999d7867364b1b4a3 e388a4556c0f65e1904146cc1a846bee我是第三个P94b3e26ee717c64999d7867364b1b4a3 //我是.p2的next d42a450727133d488599a1f95fad5570我是第四个P94b3e26ee717c64999d7867364b1b4a3 94b3e26ee717c64999d7867364b1b4a3
十五、nextAll() 取得其後的所有兄弟元素
文法:nextAll(expr) expr:可選,篩選條件,取得其後符合expr條件的所有兄弟元素
$(".p2").nextAll(); //如果筛选条件改为 $(".p2").nextAll(".p4"); 则只有我是第四个P会被选中 e388a4556c0f65e1904146cc1a846bee e388a4556c0f65e1904146cc1a846bee我是第一个P94b3e26ee717c64999d7867364b1b4a3 25fdd61924ec43f68f6d130ac257deb1我是第二个P94b3e26ee717c64999d7867364b1b4a3 e388a4556c0f65e1904146cc1a846bee我是第三个P94b3e26ee717c64999d7867364b1b4a3 //会被选中,是.p2后面的兄弟元素 d42a450727133d488599a1f95fad5570我是第四个P94b3e26ee717c64999d7867364b1b4a3 //会被选中,是.p2后面的兄弟元素 94b3e26ee717c64999d7867364b1b4a3
十六、nextUntil() 取得其後的元素,直到參數能匹配上的為止,不包括結束條件那個
语法:nextUntil([expr|ele][,fil]) expr筛选表达式 | DOM元素筛选,注意不包括参数里的那一个
$(".p2").nextUntil(".p4"); //注意此方法并不会包括.p4 e388a4556c0f65e1904146cc1a846bee e388a4556c0f65e1904146cc1a846bee我是第一个P94b3e26ee717c64999d7867364b1b4a3 25fdd61924ec43f68f6d130ac257deb1我是第二个P94b3e26ee717c64999d7867364b1b4a3 e388a4556c0f65e1904146cc1a846bee我是第三个P94b3e26ee717c64999d7867364b1b4a3 //会被选中,是.p2后面的兄弟元素 d42a450727133d488599a1f95fad5570我是第四个P94b3e26ee717c64999d7867364b1b4a3 //不会被选中,我作为结束条件,但不包括我 94b3e26ee717c64999d7867364b1b4a3
十七、offsetPosition() 返回第一个用于定位的祖先元素,即查找祖先元素中position为relative或absolute的元素。
语法:offsetPosition() 此方法没有参数 由于CSS的绝对定位的定位基准是相对最近的一个已定位元素,因此此方法的作用不言而喻。
$("span").offsetParent(); 23380152bb7a1f6d26abfb41d9f06425 //选中的是p,因此p是已定位元素。 e388a4556c0f65e1904146cc1a846bee 45a2772a6b6107b401db3c9b82c049c2我是一个span54bdf357c58b8a65c66d7c19c8e4d114 94b3e26ee717c64999d7867364b1b4a3 94b3e26ee717c64999d7867364b1b4a3
十八、parent() 获取指定元素的直接父元素
语法:parent(expr) expr为筛选条件,如果直接父元素不符合条件,则不返回任何元素(无论它的祖先是否具有能与expr匹配的)
$("span").parent(); 23380152bb7a1f6d26abfb41d9f06425 e388a4556c0f65e1904146cc1a846bee //我是span的直接父元素,我会被匹配到 45a2772a6b6107b401db3c9b82c049c2我是一个span54bdf357c58b8a65c66d7c19c8e4d114 94b3e26ee717c64999d7867364b1b4a3 94b3e26ee717c64999d7867364b1b4a3
十九、parents() 获取指定元素的所有祖先元素,一直到6c04bd5ca3fcae76e30b72ad730ca86d36cc49f0c466276486e50c850b7e4956
语法:parents(expr) expr为筛选条件,如果某个祖先元素不符合expr则排除
$("span").parents(); 23380152bb7a1f6d26abfb41d9f06425 //我是span的祖先元素,我也会被匹配到.另外6c04bd5ca3fcae76e30b72ad730ca86d36cc49f0c466276486e50c850b7e4956也会被匹配到 e388a4556c0f65e1904146cc1a846bee //我是span的直接父元素,我会被匹配到 45a2772a6b6107b401db3c9b82c049c2我是一个span54bdf357c58b8a65c66d7c19c8e4d114 94b3e26ee717c64999d7867364b1b4a3 94b3e26ee717c64999d7867364b1b4a3
二十、parentsUntil() 获取指定元素的祖先元素,知道参数里能匹配到的为止
语法:parentsUntil(expr) expr为停止参数,一直匹配到expr为止,同时参数的条件是不会被匹配中的。
$("span").parentsUntil("p"); 23380152bb7a1f6d26abfb41d9f06425 //我是span的祖先元素,但是我作为停止条件,我也不会被选中 e388a4556c0f65e1904146cc1a846bee //我是span的直接父元素,我会被选中 45a2772a6b6107b401db3c9b82c049c2我是一个span54bdf357c58b8a65c66d7c19c8e4d114 94b3e26ee717c64999d7867364b1b4a3 94b3e26ee717c64999d7867364b1b4a3
二十一、prev() 获取指定元素的前一个兄弟元素
语法:prev(expr) expr:可选。当上一个兄弟元素不符合参数中的条件时,不返回任何元素。
$(".p2").prev(); e388a4556c0f65e1904146cc1a846bee e388a4556c0f65e1904146cc1a846bee我是第一个P94b3e26ee717c64999d7867364b1b4a3 //我会被选中,我是.p2的前一个元素。 25fdd61924ec43f68f6d130ac257deb1我是第二个P94b3e26ee717c64999d7867364b1b4a3 e388a4556c0f65e1904146cc1a846bee我是第三个P94b3e26ee717c64999d7867364b1b4a3 d42a450727133d488599a1f95fad5570我是第四个P94b3e26ee717c64999d7867364b1b4a3 94b3e26ee717c64999d7867364b1b4a3
二十二、prevAll() 获取指定元素前面的所有兄弟元素
语法:prevAll(expr) expr:可选,排除所有不能够被expr匹配上的元素
$(".p4").prevAll(".p2"); e388a4556c0f65e1904146cc1a846bee e388a4556c0f65e1904146cc1a846bee我是第一个P94b3e26ee717c64999d7867364b1b4a3 //不会被选中,虽然我是.p4前面的兄弟元素,但是我没有class=p2 25fdd61924ec43f68f6d130ac257deb1我是第二个P94b3e26ee717c64999d7867364b1b4a3 //会被选中,我既是.p4前面的兄弟元素,而且我有class=p2 e388a4556c0f65e1904146cc1a846bee我是第三个P94b3e26ee717c64999d7867364b1b4a3 //不会被选中,虽然我是.p4前面的兄弟元素,但是我没有class=p2 d42a450727133d488599a1f95fad5570我是第四个P94b3e26ee717c64999d7867364b1b4a3 94b3e26ee717c64999d7867364b1b4a3
二十三、prevUntil() 获取指定元素前面的所有兄弟元素,直到参数里的条件能够匹配到的。 注意参数条件本身不会被匹配
语法:prevUntil([expr|ele][,fil]) expr匹配表达式 | DOM元素匹配
$(".p4").prevUntil(".p2"); e388a4556c0f65e1904146cc1a846bee e388a4556c0f65e1904146cc1a846bee我是第一个P94b3e26ee717c64999d7867364b1b4a3 //不会被选中,到p2就停止了 25fdd61924ec43f68f6d130ac257deb1我是第二个P94b3e26ee717c64999d7867364b1b4a3 //不会被选中,我是停止条件,不包括我 e388a4556c0f65e1904146cc1a846bee我是第三个P94b3e26ee717c64999d7867364b1b4a3 //会被选中,我在.p2前,递归到我在到.p2 d42a450727133d488599a1f95fad5570我是第四个P94b3e26ee717c64999d7867364b1b4a3 //不会被选中,我自己怎么可能是我自己前面的呢? 94b3e26ee717c64999d7867364b1b4a3
/******************** 串联 *******************************/
二十四、siblings() 获取指定元素的兄弟元素,不分前后
语法:siblings(expr); expr为筛选条件,不符合条件的不会选中
$(".p2").siblings(); e388a4556c0f65e1904146cc1a846bee e388a4556c0f65e1904146cc1a846bee我是第一个P94b3e26ee717c64999d7867364b1b4a3 //会被选中,我是.p2的兄弟元素 25fdd61924ec43f68f6d130ac257deb1我是第二个P94b3e26ee717c64999d7867364b1b4a3 //不会被选中,我是自己 e388a4556c0f65e1904146cc1a846bee我是第三个P94b3e26ee717c64999d7867364b1b4a3 //会被选中,我是.p2的兄弟元素 d42a450727133d488599a1f95fad5570我是第四个P94b3e26ee717c64999d7867364b1b4a3 //会被选中,我是.p2的兄弟元素 94b3e26ee717c64999d7867364b1b4a3
二十五、add() 将选中的元素添加到jQuery对象集合中
add(expr|elements|html|jQueryObject) expr:选择器表达式 | DOM表达式 | Html片段 | jQuery对象,将jQuery对象集合一起方便操作;
$(".p2").add("span").css("background-color","red"); e388a4556c0f65e1904146cc1a846bee e388a4556c0f65e1904146cc1a846bee我是第一个P94b3e26ee717c64999d7867364b1b4a3 25fdd61924ec43f68f6d130ac257deb1我是第二个P94b3e26ee717c64999d7867364b1b4a3 //会变红 e388a4556c0f65e1904146cc1a846bee我是第三个P94b3e26ee717c64999d7867364b1b4a3 d42a450727133d488599a1f95fad5570我是第四个P94b3e26ee717c64999d7867364b1b4a3 94b3e26ee717c64999d7867364b1b4a3 45a2772a6b6107b401db3c9b82c049c2我是一个span54bdf357c58b8a65c66d7c19c8e4d114 //会变红
二十六、andSelf() 将自身加到选中的jQuery集合中,以方便一次性操作
andSelf() 此方法无参数
$(".p2").nextAll().andSelf().css("background-color","red"); e388a4556c0f65e1904146cc1a846bee e388a4556c0f65e1904146cc1a846bee我是第一个P94b3e26ee717c64999d7867364b1b4a3 25fdd61924ec43f68f6d130ac257deb1我是第二个P94b3e26ee717c64999d7867364b1b4a3 //会变红,这就是andSelf()的效果 e388a4556c0f65e1904146cc1a846bee我是第三个P94b3e26ee717c64999d7867364b1b4a3 //会变红 d42a450727133d488599a1f95fad5570我是第四个P94b3e26ee717c64999d7867364b1b4a3 //会变红 94b3e26ee717c64999d7867364b1b4a3
二十七、end() 将改变当前选择器选中的操作回退为上一个状态。
end() 此方法没有参数
$(".p2").next().end().css("background-color","red"); e388a4556c0f65e1904146cc1a846bee e388a4556c0f65e1904146cc1a846bee我是第一个P94b3e26ee717c64999d7867364b1b4a3 25fdd61924ec43f68f6d130ac257deb1我是第二个P94b3e26ee717c64999d7867364b1b4a3 //会变红,这就end()的效果 e388a4556c0f65e1904146cc1a846bee我是第三个P94b3e26ee717c64999d7867364b1b4a3 //不会变红,尽管next()方法之后选中的是这一个,但是由于被end()方法回退了因此是上一个。 d42a450727133d488599a1f95fad5570我是第四个P94b3e26ee717c64999d7867364b1b4a3 94b3e26ee717c64999d7867364b1b4a3
以上是如何使用jQuery篩選排除元素以修改指定標籤的屬性的詳細內容。更多資訊請關注PHP中文網其他相關文章!