07-DOM元素

添加、删除和替换 HTML 元素
Appendchile() 创建新的html元素
但是需要先创建该元素
比如

var para=document.createElement("p");//创建元素节点 
var node=document.createTextNode("This is new.");
//穿件文本节点 para.appendChild(node);//添加节点  
var element=document.getElementById("div1"); 
element.appendChild(para);//添加节点
Code language: JavaScript (javascript)

InsertBefore()插入元素
在第一个元素的前面进行添加

var para=document.createElement("p"); 
var node=document.createTextNode("This is new."); 
para.appendChild(node);  
var element=document.getElementById("div1"); 
var child=document.getElementById("p1"); 
element.insertBefore(para,child);
document.getElementById("myList").insertBefore(newItem,existingItem);

Removechild删除已有的HTML元素
要删除元素，必须先拿到它的分节点对象

var parent=document.getElementById("div1"); //拿到父节点 
var child=document.getElementById("p1");//获得子节点 
parent.removeChild(child);//移除子节点
Code language: JavaScript (javascript)

有时候 我们可以通过找到要删除的节点 然后通过parentnode来获取其父节点
然后删除子节点
找到您需要删除的子元素，然后使用 parentNode 属性来查找其父元素：

var child=document.getElementById("p1"); child.parentNode.removeChild(child);
Code language: JavaScript (javascript)

替换HTML元素

var para=document.createElement("p"); 
var node=document.createTextNode("This is new."); 
para.appendChild(node);  var parent=document.getElementById("div1"); 
var child=document.getElementById("p1"); 
parent.replaceChild(para,child);
Code language: JavaScript (javascript)