### 节点操作

### 节点操作

    var list = document.getElementById('list')
    console.log(list);//`<ul id="list"><li>`001 `</li>` `<li>`002 `</li><li>`003 `</li><li>`004 `</li></ul>`

    //获取list的所有子节点
    var res1 = list.childNodes;
    console.log(res1);//NodeList(9) [text, li, text, li, text, li, text, li, text]

    //判断节点类型
    var res2 = list.childNodes[0].nodeType
    console.log(res2);//==>3
    //value:1==>Element     元素节点
    //value:2==>Atter       属性节点
    //value:3==>text        文本节点
    //value:8==>Comment     注释节点
    //value:9==>Document    文档节点
    //value:10==>DocumentType 文档类型节点
    //value:11==>DocumentFragment 文档片段节点

    //获取节点名称
    var res3 = list.children[4].nodeName
    console.log(res3);//==>P

    //获取节点内容
    var res4 = list.childNodes[0].nodeValue
    var res5 = list.childNodes[1].innerHTML;
    console.log(res4);
    console.log(res5);//==>001

    //获取父节点
    var res6 = list.parentNode
    var res7 = list.parentElement
    console.log(res6);
    console.log(res7);

    //获取第一个子节点(元素节点),包括空格
    var res8 = list.firstChild
    var res9 = list.firstElementChild
    console.log(res8);//==>#text
    console.log(res9);//==>

    //获取最后一个子节点(元素节点),包括空格
    var res10 = list.lastChild
    var res11 = list.lastElementChild
    console.log(res10);//==>test.html:65 #text
    console.log(res11);//==>`<p>`005 `</p>`

    //获取list上边的兄弟节点
    var res12 = list.previousElementSibling
    console.log(res12);//==>`<h1>`我是list上边的h1元素节点 `</h1>`

    //获取list下边的兄弟元素节点
    var res13 = list.nextElementSibling
    console.log(res13);//==>`<h1>`我是list下边的h2元素节点 `</h1>`

    //链式调用
    var res14 = list.previousElementSibling.previousElementSibling
    console.log(res14);//==>`<h2>`asdfghjkl;`</h2>`

    //获取list的所有元素节点
    var res15 = list.children
    var res16 = list.children[0]
    console.log(res15);
    console.log(res16);

    //获取list第一个子元素节点
    var res17 = list.children[0]
    var res18 = list.firstElementChild
    console.log(res17);
    console.log(res18);

    //获取list最后一个子元素节点
    var res19 = list.children[list.children.length - 1]
    var res20 = list.lastElementChild
    console.log(res19);
    console.log(res20);