DOM文档对象类型

childNodes子节点，获取所有的文本和子元素

children子元素

parentNode父节点

nextElementSibling同级的下一个子元素

previousElementSibling同级的上一个子元素

nextSibling同级的下一个节点

previousSibling同级的上一个节点

    console.log(uls.childNodes);

    console.log(uls.children);

    console.log(uls.parentNode);

    console.log(lis[1].nextElementSibling);

    console.log(lis[1].previousElementSibling);

    console.log(lis[1].nextSibling);

    console.log(lis[1].previousSinling);

createElement创建元素

appendChild插入元素

如果插入的元素原文档里没有，那就是直接插入；如果有，那就是把要插入的元素从原位置移动到被插入元素的最后面。

removeChild删除子元素

insertBefore(ele1,ele2)在ele2前插入

ele1要插入的元素，如果原先在文档里有此元素，那么就是调换位置，如果没有，那就是插入

ele2插入在谁前面

hasChildNodes检查元素是否有子节点

replaceChild(ele1,ele2)替换元素

ele1替换的元素，如果原先在文档里有此元素，那么对ele1来说就是换个位置

ele2被替换的元素，替换后被删除

    var newDiv=document.createElement("div");

    uls.appendChild(newDiv);

    uls.removeChild(lis[2]);

    uls.insertBefore(newDiv,lis[0]);

    console.log(uls.hasChildNodes());//返回布尔值

    uls.replaceChild(newDiv,lis[1]);

getAttribute获取元素的属性值

setAttribute更改原有属性的属性值/创建新的属性

setAttribute假如元素有该属性，则为更改原有属性的属性值

setAttribute假如元素无该属性，则为创建新的属性

removeAttribute删除属性

hasAttribute检查是否有此属性

cloneNode()复制元素

cloneNode(true)复制整个元素，包括子节点

cloneNode(false)复制元素本身，不包括子节点

cloneNode接收的参数默认为false，只能复制元素或节点，不能复制事件，也就证明了复制的元素和原元素不全等

    <div class="imdiv" index="5"></div>

    var imdiv=document.querySelector(".imdiv");

    console.log(imdiv.getAttribute("index"));

    imdiv.setAttribute("index",90);//改变原有属性值

    imdiv.setAttribute("width",100);//创建新的属性

    imdiv.removeAttribute("index");

    console.log(imdiv.hasAttribute("index"));//返回布尔值

    var newDiv=imdiv.cloneNode(true);

    document.body.appendChild(newDiv);

DOM简易应用：

    <button class="dombtn">增加一个li</button>
    <ul class="domul"></ul>
    <script>
        var btn=document.querySelector(".dombtn");
        var ul=document.querySelector(".domul");
        var sum=1;
        btn.onclick=function(){
            var newLi=document.createElement("li");
            newLi.innerHTML="我是第"+sum+"个li";
            sum++;
            var newSpan=document.createElement("span");
            newSpan.innerHTML="删除";
            newSpan.style.color="blue";
            newLi.appendChild(newSpan);
            ul.appendChild(newLi);
            newSpan.onclick=function(){
                this.parentNode.parentNode.removeChild(this.parentNode);
            }
        }
    </script>

    增加一个li