Jquery之DOM節點遍歷

2021-07-24 17:49:33 字數 1063 閱讀 8818

html dom 是將乙個html文件當做樹結構,樹有根枝葉,html文件也有根枝葉,這些根枝葉,都可以叫做乙個個的節點,即dom節點;

要對html進行操作,也就是對html 的dom節點進行操作,要操作,首先就是要找到進行操作的節點,其中一種方法就是用jquery的選擇器:基本選擇器,層次選擇器,過濾選擇器,表單選擇器;

比較常用的還有jquery節點的遍歷,主要有的方法如下:

1.children(); 查詢匹配元素節點的子元素集合(只考慮兒子,不考慮孫子);

2.next(); 查詢匹配元素節點的緊鄰的下乙個兄弟節點;

3.prev(); 查詢匹配元素節點的緊鄰的上乙個兄弟節點;

4.siblings(); 查詢匹配元素節點的緊鄰的前後所有兄弟節點;

5.closest(); 取得最近的匹配元素,從自己開始,向上查詢,直到找到匹配元素;

6.parent(); 取得乙個匹配的爸爸節點(只有乙個爸爸);

7.parents(); 取得匹配的一層層向上的祖先(爸爸,爺爺,太爺爺,祖爺爺………..html;)

8.find(); 必須要有引數,取得匹配的所有後代(兒子,孫子,重孫…)

9.filter(); 在選擇器的基礎上再進行過濾;

10.nextall();取得匹配元素緊鄰的後續所有兄弟節點(找到自己的所有弟弟)

11.prevall();跟上乙個函式相似,該函式是取得匹配元素緊鄰的之前所有兄弟節點(找到自己的所有的哥哥)

區別:

1.children()和find()

children()只取得它的所有孩子節點(一層),find取得所有的後代節點(往下多層);

children()函式的引數可選,find()函式必須要有選擇器引數;

2.parent()、parents()和closest()

parent()逐級向上遍歷節點,返回乙個爸爸(不包括自身);

parents()逐級向上遍歷節點,返回多個,包括爸爸,爺爺,太爺爺,祖爺爺……….html,不包括自身;

closest()從自身找起,逐級向上遍歷節點,直到找到乙個匹配的元素節點,返回;

jQuery之dom操作 遍歷節點

jquery之dom操作 遍歷節點 children children selector 只考慮子元素,不考慮其他後代元素 next next selector 下乙個兄弟節點 prev prev selector 上乙個兄弟節點 siblings siblings selector 其他兄弟節點 ...

Jquery操作DOM節點

1 向dom節點中追加元素 結果 我想說 你好 結果 我想說 你好 prepend 向每個匹配元素內部前置元素 例如 我想說 p prepend 你好 結果 你好我想說 prependto 將所有匹配的元素前置到指定的元素中 例如 我想說 你好 prependto p 結果 你好我想說 after ...

jQuery操作DOM節點

dom 節點建立的過程 建立節點 元素 屬性 文字等 新增節點的屬性 加入到文件中 jquery建立節點的方法 建立元素節點 建立文字節點 直接將文字的內容新增進去 建立節點並給節點新增屬性 var div 動態建立div元素節點 節點建立完成。需要將節點新增到文件中,新增新內容的時候需要用到接下來...