一：Dom模型的全称--->Document Object Model
                             ---->文档对象模型

二WEB页面的html文档，document就是根节点。其他的子对象就是子节点


三节点类型    （1）元素节点  例子：<input>
            （2）文本节点  例子：尚晓飞   文本节点
            （3）属性节点  例子：<input type="shang"/> shang 就是属性节点

四获取元素节点的方法
        【1】直接获取节点：
    （1）获取指定的id属性指定值的节点-->唯一
        var name=document.getElementById("uname");
    （2）获取指定的name属性值的节点--->返回的是一组
        var ad=document.getElementsByName("unameName");
    （3）获取指定元素名的节点--->返回的是一组
        var aaa=document.getElementsByTagName("input");

        【2】间接获取节点
    （1）通过父节点，获取子节点。
        //获取父节点
            var father=document.getElementById("showDiv");
            //获取该父节点的子节点node集合
            var sonarray=father.childNodes;
            alert(array[2].nodeValue);


    （2）通过字节点，获取父节点
        //通过子节点，获取父节点
            var  son=document.getElementById("a");
            var fathera=son.parentNode;
            
            alert(fathera.id);
        
    (3)通过兄弟节点，获取节点
        //兄弟节点
                var borther2=document.getElementById("realname");
                var borther1=borther2.previousSibling;//上一个兄弟节点
                var borther3=borther2.nextSibling;//下一个兄弟节点
                
                while(borther1.nodeType!=1){
                    borther1=borther1.previousSibling;
                }
                alert(borther1.value);


    注意：节点的三个属性    ---->nodeName  
                        ----->nodeValue
                        ----->nodeType
    

四：处理属性节点
    （1）元素节点.属性----->获取属性值，也可以为属性重新赋值
    （2）getAttribute(key)--->获取key属性的值
             setAttribute(key,value)--->为该节点设置属性，及属性的值


五：处理文本节点
    （1）获取一个节点内的文本，一般使用innerHtml
      (2)innerHtml不局限操作一个节点,而是可以使用Html片段直接填充页面，或直接获取Html片段。大大提高开发的灵活性
例子：    function innerhtml(){
                alert(document.getElementById("showDiv").innerHTML);
            }


六 改变文档的层次结构
    （1）创建元素节点document.creatElement
        var input=document.createElement("input");
                    input.type="text";
                    input.id="123";
                    input.value="http://www.mamicode.com/天下无双";    
     （2）通过父节点，添加到父节点里。parentNode.appendChild
        var  father=document.getElementById("showDiv");
                    father.appendChild(input);
        
      (3)插入节点 parentNode.insertBefore(newnode,beforenode)
        var ab=document.getElementById("a");
                    father.insertBefore(input,ab);
        
     (4)覆盖节点 parentNode.replaceChild（newnode,oldnode）
        旧节点必须存在，否则发生异常
        father.replaceChild(input,ab);

    （5）移除某个节点parentNode.removeChild(childNode)
        father.removeChild(ab)