DOM的组成：

      HTMLDOM  网页元素内容

      DOMCore  js文件内容

      XMLDOM   配置文件


parentNode             获取父节点

childNodes             获取子节点集合（数组）

firstChild             获取第一个子节点

lastChild              获取最后一个子节点

nextSibling            获取当前节点的下一个节点

previousSibling        获取当前节点的上一个节点

firstElementChild      获取第一个子节点（不会获取空格【文本节点】）

lastElementChild       获取最后一个子节点（不会获取空格【文本节点】）

nextElementSibling     获取当前节点的下一个节点（不会获取空格【文本节点】）

previousElementSibling 获取当前节点的上一个节点（不会获取空格【文本节点】）


nodeName        获取标签名

nodeValue       获取节点值（一般获取属性节点的值）

nodeType        获取节点类型数字

   类型                   nodeType值

  元素Element（标签）         1

  属性attr                    2

  文本text（空格）            3

  注释comments                8

  文档document                9



创建节点                  document.createElement("标签名");

将节点追加至最后          父级.appendChild("追加的节点");

将节点追加至之前          父级.insertBefore(新节点,旧节点);    

克隆复制节点                    document.cloneNode(布尔值);  
      true代表复制标签所有（有内容）

      false代表只复制标签（无内容）    

删除节点                  父级.removeChild(p1);

替换节点                  父级.replaceChild(新节点,旧节点);

给标签设置属性和值        元素.setAttribute(属性,值)

根据属性获取元素的属性值  元素.getAttribute(属性)  
给元素添加样式            获取的元素.style.属性="属性值"  

                          document.getElementById("p1").style.color="yellow";


给元素添加整套样式        获取的元素.className="类样式名称";

                                document.getElementById("p1").className="c1";

                  注：必须要有设置好的内部样式里面的类选择器

获取元素样式值的三种方式：

    第一种：

          获取的元素.style.属性名

          document.getElementById("p1").style.color  获取id为p1元素的样式color属性值                                                        
   注：只能获取行内样式

    第二种：

         document.defaultView.getComputedStyle(元素,null).属性

         var img  =  document.getElementById("img");

         document.defaultView.getComputedStyle(img,null).top   获取img节点的样式top属性值    
    第三种：

         var wid=  document.getElementById("div1");

         var w  =  wid.currentStyle.width;           获取wid节点的width属性值

             只用于兼容ie浏览器   其他浏览器无法获取

触发事件：

      onclick:        点击事件

      onmousemove:    鼠标移上去

      onmouseover:    鼠标移上去

      onmouseout:     鼠标移走

      onmousedown:    鼠标摁下去  
滚动事件调用方法

      window.onscroll=方法名;      
      function gun(){

         var juli = document.documentElement.scrollTop;    获取滚动条的向下滚动的距离;

         alert(juli);

         }