jquery 篩選元素 3

2022-05-05 21:21:11 字數 4776 閱讀 5111

.addback()

新增堆疊中元素集合到當前集合中,乙個選擇性的過濾選擇器。

.addback([selector])

selector

乙個字串,其中包括乙個選擇器表示式,匹配當前元素集合,不包括在內的元素。

$("li.third-item").nextall().addback().css("background-color",'red')

3 , 4 ,5 項的背景變成紅色。

.children()

獲得匹配元素集合中每乙個元素的子元素,選擇器選擇性篩選。

.children([selector])

selector 乙個用於匹配元素的選擇器字串。

$("ul .le-2").children().css("background-color","red")

//找到ul 下 類名為 .le-2 類名下的所有的子元素,將其背景顏色改成紅色。

.closest()

從元素本身開始,在dom 樹上逐級向上級元素匹配。

.closest(selector)

selector 乙個用於匹配元素的選擇器字串。

.closest( selector [, context ] )

selector 乙個用於匹配元素的選擇器字串。

context 查詢的匹配元素可以在這個dom 元素內。

.closest(jquery object)

object 乙個用於匹配元素的物件。

.closest(element)

element 乙個用於匹配元素的dom元素。

$('li.item-a').closest('li').css('background-color', 'red'); 

//從 li.item-a 開始向上級查詢li 將其背景變成紅色。

$(document).bind("click",function

(e));

.find()

通過乙個選擇器,jquery物件,或元素過濾,得到當前匹配的元素集合中每個元素的後代。

.find(selector)

selector 乙個用於匹配元素的選擇器字串。

('li.item-ii').find('li').css('background-color','red');

// 含有 item-ii選擇器的 li 裡面過濾 li 將其背景變成紅色。

.find(element)

element 乙個元素或乙個jqury物件用來匹配元素

var item1 = $('li.item-1')[0];

$('li.item-ii').find( item1 ).css('background-color', 'red');

// 含有 item-ii選擇器的 li 裡面過濾 item1 將其背景變成紅色。

.next()

獲得匹配元素集合中每個元素緊鄰的後面的同輩元素的集合。

.next([selector])

selector 乙個字串,其中包括乙個選擇器表示式匹配元素。

$('li.third-item').next().css('background-color','red');

// 獲得li 中含有 .third-item 選擇器的元素的,下乙個元素背景變成紅色。

$("p").next(".selected").css("background-color","yellow");

//獲取p 元素中 下乙個帶有.selected 選擇器的元素,背景變成黃色。

.nextall()

獲取每個匹配元素集合中所有下面的同輩元素,選擇性篩選的選擇器。

.nextall([selector])

selector 乙個字串,其中包括乙個選擇器表示式匹配元素。

$('li.third-item').nextall().css('background-color','red');

// 獲得li 中含有 .third-item 選擇器的元素的,下所有元素背景變成紅色。

.nextuntil()

通過選擇器,或dom 節點,或物件 得到每個元素之後所有的兄弟元素,但不包括匹配的元素。

.nextuntil([selector][,filter])

selector 乙個字串,其中包括乙個匹配元素選擇器表示式。

filter 乙個字串,其中包含乙個選擇器表示式用來匹配的元素。

.nextuntil([element][,filter])

element 乙個用於匹配元素的dom元素。

filter 乙個字串,其中包含乙個選擇器表示式用來匹配的元素。

$("#term-2").nextuntil("dt").css("background-color","red")

// 獲取#term-2 下面所的 元素 為dt 的元素,將背景變成紅色。

.parent()

取得匹配元素集合中,每乙個元素的父元素,可以提供乙個可選的選擇器。

.parent([selector])

selector 乙個字串,其中包含乙個選擇器表示式用來匹配的元素。

$("li.item-a").parent().css('background-color', 'red');

// 獲得li 中含有 .item-a 選擇器的元素的父元素,將背景變成紅色。

$("p").parent(".selected").css("background", "yellow");

//獲取p 元素中 下乙個帶有.selected 選擇器的元素 父元素,背景變成黃色。

.parents()

獲取集合中每乙個匹配元素的祖先元素,可以提供乙個可選的選擇器作為引數。

.parents([selector])

selector 乙個字串,其中包含乙個選擇器表示式用來匹配的元素。

$('li.item-a').parents().css('background-color', 'red');

// 獲得li 中含有 .item-a 選擇器的元素的所有祖先元素。

$("span.selected").parents("div").css("border", "2px red solid")

//獲取到span 元素含有 .selected 的元素的所有祖先元素的div

.parentsuntil()

查詢當前元素的所有的前輩元素,直到遇到選擇器,dom 物件 匹配的元素為止。

.parentsuntil([selector][,filter])

selector 選擇器字串,用於匹配到哪個祖先元素時停止匹配。

filter 乙個字串,用於匹配元素的選擇器表示式字串。

.parentsuntil([element][,filter])

element dom節點 或物件 用於確定到哪個前輩元素時候停止匹配。

filter 乙個字串,用於匹配元素的選擇器表示式字串。

$("li.item-a").parentsuntil(".level-1").css("background-color", "red");

.prev()

取得乙個包含匹配的元素集合中每乙個元素緊鄰的前乙個同輩元素的集合。選擇性篩選的選擇器。

.prev([selector])

selector 乙個用於匹配元素的選擇器字串。

$('li.third-item').prev().css('background-color', 'red');

//獲得li 中含有 .third-item 選擇器的元素的,上乙個元素背景變成紅色。

.prevall()

獲取集合中每乙個匹配元素的所有前面的兄弟元素。

.prevall([selector])

乙個字串,其中包含乙個選擇器表示式匹配元素。

$('li.third-item').prevall().css('background-color', 'red');

.prevuntil()

.prevuntil( [selector ] [, filter ] )

selector

選擇器字串,用於確定到哪個排在前面的同輩元素時停止匹配

filter

乙個字串,其中包含乙個選擇器表示式用來匹配的元素。

$("#term-2").prevuntil("dt").css("background-color", "red");

.siblings()

獲得匹配元素集合中每乙個元素的兄弟元素,可以提供乙個可選的選擇器。

.siblings([selector])

selector 乙個用於匹配元素的選擇器字串。

$('#term-2').siblings().css("background-color", "red");

$("p").siblings(".selected").css("background", "yellow");

jQuery 元素篩選

eq 獲取給定索引的元素 功能跟 eq 一樣 first 獲取第乙個元素 功能跟 first 一樣 last 獲取最後乙個元素 功能跟 last 一樣 filter exp 留下匹配的元素 is exp 判斷是否匹配給定的選擇器,只要有乙個匹配就返回,true has exp 返回包含有匹配選擇器的...

jquery篩選元素函式

jquery篩選元素函式 1.過濾 匹配第二個p元素 button click function 匹配第乙個li元素 button click function 匹配最後乙個元素 button click function 檢查匹配的元素是否含有指定的類 button click function ...

jquery篩選元素函式

jquery篩選元素函式 1.過濾 匹配第二個p元素 button click function 匹配第乙個li元素 button click function 匹配最後乙個元素 button click function 檢查匹配的元素是否含有指定的類 button click function ...