jQuery操作DOM節點

2021-09-24 17:19:33 字數 2305 閱讀 6950

dom 節點建立的過程（建立節點《元素、屬性、文字等》、新增節點的屬性、加入到文件中）

jquery建立節點的方法：

建立元素節點:

$("


")；
建立文字節點：

$("直接將文字的內容新增進去


")；
建立節點並給節點新增屬性：

var div = $("動態建立div元素節點


")
節點建立完成。需要將節點新增到文件中，新增新內容的時候需要用到接下來的：

向每個匹配的元素（內部）的後面追加內容

把所有匹配的元素追加到另乙個，指定的元素後面中

prepend在被選元素的開頭（在內部）插入指定內容

prependto把所有匹配的元素前置到另乙個指定的元素集合中

after在被選元素的後面（在外部）插入指定的內容

insertafter在目標元素前面插入集合中 每個匹配的元素

before在被選元素的前面（在內部）插入指定內容

insertbefore在目標元素後面插入集合中 每個匹配的元素
prepend() 與 prependto()方法 ：
prepend() 和 prependto() 方法作用相同。差異在於語法：內容和選擇器的位置，以及 prepend() 方法能夠使用函式來插入內容。

after與insertafter方法 ：
after()和.insertafter() 實現同樣的功能。主要的不同是語法——特別是（插入）內容和目標的位置。 對於after()選擇表示式在函式的前面，引數是將要插入的內容。對於 .insertafter(), 剛好相反，內容在方法前面，它將被放在引數裡元素的後面

before()與insertbefore()方法 ：
before()和.insertbefore()實現同樣的功能。主要的區別是語法——內容和目標的位置。 對於before()選擇表示式在函式前面，內容作為引數，而.insertbefore()剛好相反，內容在方法前面，它將被放在引數裡元素的前面

remove刪除

empry清空

remove()：



你最喜歡的水果是？
empty()：



你最喜歡的水果是？
remove()與empty()方法的區別 ：

remove()方法刪除會把標籤也一起刪除 而 empty()方法只會把標籤裡面的內容清空標籤還在

replacewith用提供的內容替換集合中所有匹配的元素並且返回被刪除元素的集合

replaceall用集合的匹配元素替換每個目標元素

replacewith() ：



你最喜歡的水果是？
replaceall () ：



你最喜歡的水果是？
replaceall()和.replacewith()功能類似，主要是目標與內容替換的位置區別

clone(引數)轉殖匹配的dom元素並且選中轉殖的副本

clone(引數) ：



你最喜歡的水果是？
clone() 方法 是複製乙個元素，不包含其所有事件

clone(true) 方法 是複製乙個元素及其所有事件，

Jquery操作DOM節點

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

jQuery基礎 DOM節點操作

如 p id name a href p 增加環繞節點 方法說明 wrap 用指定結構的元素包裹元素 wrapall 用指定結構的元素包裹多個元素 wrapinner 用指定結構元素包裹元素的內容 節點內部插入 方法說明 向每個匹配元素內部的最後面新增元素 將所有匹配的元素追加到指定的元素中 pre...

jQuery之dom操作 遍歷節點

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