1. 程式人生 > >DOM——遍歷.parent()、.parents()、.closest()和.next()

DOM——遍歷.parent()、.parents()、.closest()和.next()

dom——遍歷

遍歷.parent()、.parents()、.closest()和.next()

1 .parent()快速查找合集裏面的每一個元素的父元素,即父親與兒子的關系,因為是父元素,所以只會向上查找一級

2 .parent()無參數,能夠在DOM樹中搜索到這些元素的父級元素,有序的向上匹配元素,並根據匹配的元素創建一個新的JQuery對象

3 .parent()選擇性地接受同一型選擇器表達式,需要對這個合集對象進行一定的篩選,找出目標元素,允許傳一個選擇器的表達式

4 .parents()可以快速查找合集裏面的每一個元素的所有祖輩元素,

5 .parents()無參數,選擇性地接受同一型選擇器表達式,返回的元素秩序是從離他們最近的父級元素開始的

6 .parents()能夠在DOM樹中搜索到這些元素的祖先元素,有序的向上匹配元素,並根據匹配的元素創建一個新的JQuery對象

7 .parents()需要對這個合集對象進行一定的篩選,找出目標元素,允許傳一個選擇器的表達式

8 .parents()和.parent()的區別

.parent()只會查找一級,只進行一個單級DOM樹查找,返回一個包含document的集合

.parents()會往上一直查找到祖先節點,返回一個空集合

9 .closest()接受一個匹配元素的選擇器字符串,從元素本身開始,在DOM樹上逐級向上級元素匹配,並返回最先匹配的祖先元素

10 .closest()查找當前元素的父輩祖輩元素,給定的JQuery集合或元素來過濾元素,匹配合集中每一個元素的祖先元素,需要對這個合集對象進行一定的篩選,找出目標,允許傳一個JQuery的對象

11 .parents()和.closest()的區別

起始位置

.parents()開始於父元素

.closest()開始於當前元素

便利的目標

.parents()遍歷到文檔根元素,一直查找到根元素,並將匹配的元素加入集合

.closest()要找到指定的目標,向上查找直到找到一個匹配的就停止查找

結果

.parents()返回的是包含零個或多個元素的JQuery對象

.closest()返回的是包含零個或一個元素的JQuery對象

12 .next()無參數,可以快速查找指定元素集合中每一個元素緊鄰的後面同輩元素的元素集合,找遍元素集合中緊跟著這些元素的直接兄弟元素,並根據匹配的元素創建一個新的JQuery對象

13 .next()匹配合集中每一個元素的下一個兄弟元素,選擇性的接受同一類選擇器表達式,需要對這個合集對象進行一定的篩選,找出目標,允許傳一個選擇器的表達式

DOM——遍歷.parent()、.parents()、.closest()和.next()