今天学习了如何用原生js写dom元素（节点），下面是结合所学文档W3C整理的笔记：
1.添加节点
创建节点：使用createElement创建元素，使用createTextNode创建文本节点
首先是一段html代码，下面的例子都引用这个。
<div id="div1">
this is first paragraph
this is second paragraph
</div>
Js部分：
//创建一个新的元素
var para=document.createElement("p");
//创建一个文本节点
var node=document.createTextNode("hello，reader");
//向元素追加这个文本节点
para.appendChild(node);
//找到一个已有元素
var element=document.getElementById("div1");
//向已有的元素追加这个新元素
element.appendChild(para);
效果图：
2.插入节点
appendChild，insertBefore，insertBefore接受两个参数，第一个是插入的节点，第二个是参照的节点
such as：insertBefore（a,b），a会插在b的前面
3.替换元素replaceChild()和删除节点removeChild()
//替换元素
var replaceChild=documnet.body.replaceChild(createNode,div1);
//删除节点
var parent=document.getElementById("div1");
var child=document.getElementById("p2");
child.parentNode.removeChild(child);
效果图：
4.节点的属性
firstChild:第一个子节点
lastChild:最后一个子节点
childNodes:子节点集合，获取其中子节点可以someNode.childNodes[index]或者someNode.childNodes.item(index)
nextSibling:下一个兄弟节点
previousSibling：上一个兄弟节点
parentNode：父节点
5.注意：childNodes.length存在跨浏览器问题。
Such as：
aaa
bbb
ccc
ddd
在ie中，ul.childNodes.length不会计算li之间的换行空格，从而得到数值为4
在firefox、chrome,safari中，会有包含li之间的空白符的5个文本节点，因此ul.childNodes.length为9
若要解决跨浏览器问题，可以将li之间的换行去掉，改成一行书写格式。