JQuery DOM節點操作

2021-08-14 17:24:17 字數 1625 閱讀 5115

1. 建立、移動節點

var box = $("

");   //建立節點

return "";    //html代表原本裡面的內容

$("div").prepend("");  //插入節點,插入到內容的前面

$("div").prepend(function(index, html) {

return "";    //html代表原本裡面的內容

box.prependto("body");   //插入的內容前面

$("div").after("");  //插入節點,插入到同級節點的下面

$("div").after(function(index, html) {

return "";    //html代表原本裡面的內容

$("div").before("");  //插入節點,插入到同級節點的上面

$("div").before(function(index, html) {

return "";    //html代表原本裡面的內容

box.insertbefore("div");  //移動box到div上面

box.insertafter("div");   //移動box到div的下面

2. 包裹、複製、替換、刪除節點

$("div").wrap("123456");  //使用strong標籤包裹div元素

$("div").wrap(document.getelementbyid("strong"));  //使用dom元素包裹div元素

$("div").wrap(function(index) {

return "";

$("div").unwrap();   //移除掉一層包裹

$("div").wrapall("");  //使用strong標籤包含所有div元素

$("div").wrapall(document.createelement("strong"));  //同上

$("div").wrapinner("");   //使用strong包含div內部元素

$("div").wrapinner(document.createelement("strong"));   //使用strong包含div內部元素

return """;

$("div").remove();  //刪除節點

$("div').remove("#box");  //刪除id為box的div

$("div").detach("#box");  //也是刪除節點,但是保留節點上的事件處理函式

$("div").empty();  //刪除子節點

$("div").replacewith("")  //替換節點,裡面的內容頁被替換掉

$("').replaceall("div");   //同上,替換掉之後事件處理函式將被刪除

jQuery Dom節點操作

1.jquery追加標籤 c css font size 100px 2.移除標籤 c remove 3.新增父級標籤,在某個標籤的外層新增標籤 c wrap 4.在某個標籤之前新增標籤 c before 我是before新增的標籤 5.在某個標籤之後新增標籤 c after 我是after新增的標...

jQuery DOM節點操作

函式 處理 函式處理,函式處理 html結構 jquery建立的節點是乙個jquery物件 總結 這兩個方法功能相同,主要的不同是語法 內容和目標的位置不同 2 prepend 與prependto 方法 prepend content 向每個匹配的元素內部前置內容 prependto conten...

jQuery DOM節點操作

建立節點 建立節點,可使用以下的 jquery 函式 html 這個函式會根據傳入的html 標記字串建立乙個dom 物件,並把這個 dom 物件包裝成乙個jquery 物件返回。3.需要注意的是,動態建立的新元素節點不會被自動新增到文件中,而是需要使用其他方法將其插入到文 檔中 當建立單個元素時,...