jquery獲取父級元素 同級元素以及子元素的方法

2021-09-27 02:29:40 字數 1378 閱讀 9103

有檔案的結構如下:

123

4 5

678

1. 獲取父級元素-----parent()

//獲取td2節點的父節點即tr1,並將背景顏色的樣式改為黑色     

$('.td2').parent().css('background-color', 'black');

另外:parent([document])方法取得乙個包含著所有匹配元素的唯一父元素的元素集合。

比如對於下述html

hello

hello again

$("p").parent(".selected")
則是獲取p標籤的父元素中每個class為selected的父元素。

.closest(seletor) 方法獲得匹配選擇器的第乙個祖先元素,從當前元素開始沿 dom 樹向上。

c  

iii

//將class為level-2 的

//將list -item4便為紅色

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

.nextall(selector)

獲得匹配元素後面的所有同胞元素,由選擇器篩選是可選的。

//將list -item4、list-item5便為紅色

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

.prev(selector)

獲得匹配元素緊鄰的前乙個同胞元素(與next相反,則根據上述next例子反著來就可以了)

.prevall(selector)

獲得當前匹配元素前面的所有同胞元素(同上)

三、獲取子元素

.children(selector)

返回匹配元素的子元素,新增可選引數可通過選擇器進行過濾。

c  

iii//將a, b, c 的背景顏色變成紅色

$('ul.level-2').children().css('background-color', 'red');

.find(selector)

獲得當前元素的後代

c  

iii//將a、b、1、2、3 以及 c設定為紅色背景

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

JQuery 獲取父級元素 同級元素 子元素等

例 div div id div 1 這是內容1 div div id div 2 這是內容2 div div id div 3 這是內容3 div div id div 4 這是內容4 div div id div 5 這是內容5 div div id div 6 這是內容6 div id div...

jquery獲取父元素子元素同級元素

一 獲取父級元素 1 parent expr 獲取指定元素的所有父級元素 href fir href sec href thr href fiv document ready function 獲取指定元素的下乙個同級元素 注意是下乙個同級元素哦 這個例子的結果是,只有list item 4背景色變...

jquery獲取父元素 同級元素 子元素

jquery.parent expr 找父親節點,可以傳入expr進行過濾,比如 span parent 或者 span parent class jquery.parents expr 類似於jquery.parents expr 但是是查詢所有祖先元素,不限於父元素 jquery.childre...