原生js添加元素

今天做页面使用的mui，因为使用mui情况下无法使用jquery，于是在ajax请求完毕添加元素的时候发现自己竟然对原生js添加元素的方法有点模糊了，真是越活越倒退了，赶紧整理一波。

首先最简单的innerHTML，这个不想多说，入门新手喜欢这么用，但他的缺点也很明显：不管你渲染部分还是全部，始终需要替换原先所有的子元素，也就是需要重复渲染，会增加浏览器压力。

接下来就是正题了，js推荐是这样进行元素添加：

1.创建游离元素节点：let div=document.createElement("div");

2.给创建元素添加属性：div.setAttribute("class","className");注意setAttribute一次只能设置一条属性

3.创建文本节点:let textNode=document.createTextNode("需要添加的文本")；

4.将文本节点添加到元素节点中div.appendChild(textNode);

5.加元素节点插入文档：Parent.appendChild(div);

 

over