示例
把<ul><li>第1行</li><li>第2行</li>...</ul>（ul之间有10个li元素）插入body里面
程序
var lis = ''
var ul = document.createElement("ul") //创建元素
for(var i = 1; i <= 10; i++) {
lis += "<li>第" + i + "行</li>"
}
ul.innerHTML = lis //动态改变文本
document.body.appendChild(ul) //添加元素到文档树
典型操作：
1.创建元素document.createElement()
a. document.createElement(标签名)
var div = document.createElement('div')
div.id = 'myNewDiv'
div.className = 'box'
b. document,createElement(完整的HTML标签) 仅IE中可用
document.createElement("<div id = \"myNewDiv\" class = \"box\"></div>")
2.innerHTML、outerHTML、innerText、outerText IE专有
3.添加元素到文档树
a.someNodes.appendChild(node) --- 向childNodes列表的末尾添加节点node
// 若node不属于文档，则执行添加
var rnode = someNodes.appendChild(node)
console.log(rnode === node) //true
console.log(someNodes.lastChild === node) //true
//若node属于文档一部分，则将该节点从原来位置移至末尾
var rnode = someNodes.appendChild(someNodes.firstChild)
console.log(rnode === someNodes.firstChild) //false
console.log(rnode ===someNodes.lastChild) //true
```
b. someNodes.insertBefore(node,nextNode) --- 向childNodes列表中nextNode所在位置添加节点node,nextNode后移一位
```js
//nextNode = null
var rnode = someNodes.insertBefore(node,null)
console.log(node ===someNodes.lastChild) //true
//nextNode为有效参考节点
var rnode = someNodes.insertBefore(node,someNodes.lastChild)
console.log(node === someNode.childNodes[someNodes.childNodes.length-2]) //true
c.someNodes.replaceChild(node,replaceNode) --- 使用node代替childNodes列表中的replaceNode
//替换第一个节点
var rnode = someNodes.repace(node,someNodes.firstChild)
