Javascript的节点的获取以及修改

访问子节点：

childNodes 访问当前节点所有的子节点；

firstChild:访问节点中的首位；

lastChild:访问节点中的最后一个；

将纯白文本剔除：(就是只算元素节点)

children:访问孩子节点； firstElementchild,lastElementchild,nextElementchild

nextSibing:访问当前节点的兄弟节点的下一个节点；

previousSibing:访问当前节点的兄弟节点的上一个节点；

attributes 获取当前节点上的所有属性节点；

结果是集合：无序，不重复；

alert(odiv1.attributes.getNamedItem("title").nodeValue);

alert(odiv1.attributes["title"].nodeName);——简化版

document.write（）:会覆盖掉页面上原有的内容；

（1）creatElement();格式： document.creatElement(); 参数：标签名；

（2）appendChild(); 格式：node1.appendChild(node2);——将node2节点插入node1子节点的末尾

（3）createTextNode() 格式：document.createTextNode(文本)； 创建文本；

（4）insertBefore(); 格式：box1.parentNode.insertBefore(box2,box1); 将box2添加到box1前面

  odiv.parentNode.insertBefore(otex,odiv); 
    document.body.insertBefore(otex,odiv);    (两种方法)

(5) replaceChild(); 格式：box1.parentNode.replaceChild(box2,box1); 用box2将box1代替掉

     var newnode=odiv.cloneNode(odiv);
         document.body.appendChild(newnode);

(6) removaChild(); 格式：box.parentNode.remove(box); 将box节点从页面删除；

<script>
   window.οnlοad=function(){
       var obtn=document.getElementById("btn1");
       var odiv=document.getElementById("div1");
       obtn.οnclick=function(){
         /*   document.write('<h2>你好啊</h2>'); */
         var op=document.createElement('p');
         var otex=document.createTextNode('<h2>hell</h2>');
         odiv.appendChild(otex);
         odiv.appendChild(op);
         
       }
   }
</script>