DOM 动态创建节点

1、创建一个节点
createElement(“标签名”): 按照给定的标签名创建一个新的元素节点. 方法只有一个参数：被创建的元素节点的名字, 是一个字符串. 方法的返回值：是一个指向新建节点的引用指针. 返回值是一个元素节点, 所以它的 nodeType 属性值等于 1，新元素节点不会自动添加到文档里, 它只是一个存在于 JavaScript 上下文的对象。

//1.创建一个li元素节点 var book = document.createElement("li");

2、创建文本节点
createTextNode(“文本值”): 创建一个包含着给定文本的新文本节点. 这个方法的返回值是一个指向新建文本节点引用指针，它是一个文本节点, 所以它的 nodeType 属性等于 3，方法只有一个参数：新建文本节点所包含的文本字符串. 新元素节点不会自动添加到文档里

//2.创建文本节点 var bookNode = document.createTextNode("《西游记》");

> //3.把文本节点添加到元素节点中
>       	book.appendChild(bookNode);

3、为元素添加子节点
appendChild(): var reference = element.appendChild(newChild):
给定子节点 newChild 将成为给定元素节点 element 的最后一个子节点， 方法的返回值是一个指向新增子节点的引用指针，appendChild把子节点添加到父节点中，不能指定插入的位置，默认插入到最后一个子元素后面

		//appendChild把子节点添加到父节点中，不能指定插入的位			  		置，默认插入到最后一个子元素后面
		//var books = document.getElementById("books");   父节点
		//books.appendChild(book);

4、插入节点
insertBefore(): 把一个给定节点插入到一个给定元素节点的给定子节点的前面var reference = element.insertBefore(newNode（新节点）,targetNode（目标节点的位置）);节点 newNode 将被插入到元素节点 element 中并出现在节点 targetNode 的前面. 节点 targetNode 必须是 element 元素的一个子节点。

		 //4.1获取插入位置
      	var old = document.getElementById("book2");
      	//4.2插入
      	old.parentElement.insertBefore(book,old);

5、删除节点
从一个给定元素里删除一个子节点格式：var reference = element.removeChild(node);返回值：返回值是一个指向已被删除的子节点的引用指针。
注意：某个节点被 removeChild() 方法删除时，这个节点所包含的所有子节点将同时被删除。

> //1.获取要删除节点的父元素   	var stars = document.getElementById("stars");  
> 	//2.获取要删的子节点   	
var fanbingbing =
> document.getElementById("fanbingbing");   	
//3.从子节点中把要删除的子节点删除  
> 	stars.removeChild(fanbingbing);