js DOM 動態新增

2021-09-06 16:15:40 字數 1297 閱讀 5745

非同步獲取資料難免需要動態載入頁面，接下來會記錄幾種載入方式：

方法一：

前端頁面：
js：

/**


* 將角色資訊填充到頁面


*/function fillroleinfotopage(data)


authlist.foreach(auth => 


i += 1;


});var operatetd = document.createelement('td');


operatetd.classlist.add('operate');


operatetd.classlist.add('three_icon');


/*分配*/


var assignoperate = document.createelement('i');


assignoperate.classlist.add('fa');


assignoperate.classlist.add('fa-eye');


assignoperate.classlist.add('text_blue');


/*編輯*/


var editoperate = document.createelement('i');


editoperate.classlist.add('fa');


editoperate.classlist.add('fa-pencil');


editoperate.classlist.add('text_green');


/*刪除*/


var deloperate = document.createelement('i');


deloperate.classlist.add('fa');


deloperate.classlist.add('fa-trash-o');


deloperate.classlist.add('text_red');


deloperate.onclick = function () ;


"'"+data['id']+"'"));


authoritiestd.innertext = authorities;


}
效果：

缺點：**多，麻煩，相容性差。 

js DOM模型操作

dom模型中的節點 元素節點 文字節點 屬性節點 例 私 dotnet小屋 1 a是元素節點 2 私 dotnet小屋 是文字節點 3 href 是屬性節點 dom節點的屬性 nodename string 節點名稱，根據節點的型別而定義 nodevalue string 節點的值，根據節點的型別而...

Js DOM節點屬性

在文件物件模型 dom 中，每個節點都是乙個物件。dom 節點有三個重要的屬性 1.nodename 節點的名稱 2.nodevalue 節點的值 3.nodetype 節點的型別 一 nodename 屬性 節點的名稱，是唯讀的。1.元素節點的 nodename 與標籤名相同 2.屬性節點的 no...

原生js dom操作

這裡說說一些原生js操作dom的方法 1，元素的獲取 getelementbyid getelementsbytagname getelementsbyclassname 這裡要注意這個getelementsbyclassname 在ie8以下是不相容的。相容寫法 function getbycla...