js加强

 js加强——DOM（文档对象模型，是处理一个HTML或XML文档的常用方法，DOM的设计是以对象管理组织的规约为基础的，可以用于任何编程语言）

1、DOM每一个成分都是节点。
整个文档是一个文档节点；
每个HTML标签是一个元素节点；
包含在HTML元素中的文本是文本节点；
每一个HTML属性是一个属性节点；
注释属于注释节点。

2、有层次关系

3、window.οnlοad=function()----当窗体加载完毕触发该匿名函数；
  //nodeName是节点的名称，如果是元素节点，返回标签值
  alert(div.nodeName);
  //节点的类型 ，元素节点的值是：1
  alert(div.nodeType);
  //节点的值 ，返回节点的值是：null
  alert(div.ndeValue);
  //如何获取属性节点？attributes
  if(div.nodeType==1){
  var atts=div.attributes;//当前节点的所有属性
  alert(atts.length);

4、元素节点：
nodeName=标签的名称（div）
nodeType=1;
nodeValue=null;

属性节点：
nodeName=属性的名称
nodeType=2
nodeValue=属性的值

文本节点：
nodeName=#text
nodeTYpe=3
nodeValue=文本的值

 

 

 

<script type="text/javascript">
 window.οnlοad=function(){
  //获取根结点
  var root=document.documentElement;
  //调用递归的方法
  items(root);
  document.write(str);
 }
 var str="";
 function items(node){
  //得到当前节点的所有的孩子节点
  if(node.nodeType==1){//先判断获取的根结点是不是元素节点
   str+="节点的名称:"+node.nodeName+"节点类型值:"+node.nodeType+"节点的属性值:"+node.nodeValue+"<br/>";
   if(node.hasChildNodes()){//判断该节点是不是有孩子节点
    var childs=node.childNodes;
    for(var i=0;i<childs.length;i++){
     var child=childs.item(i);//得到孩子的节点
     items(child);
    }
   }
   
  }else{
  
   str+="节点的名称:"+node.nodeName+"节点类型值:"+node.nodeType+"节点的属性值:"+node.nodeValue+"<br/>";
  
  }
 
 }
 </script>