3.认识节点

节点是组成页面的每一个成员，包括以下四种：

1. 元素节点:标签
2. 文本节点：页面上的文本，包括空格和换行
3. 注释节点：页面中的注释，包括空格和换行
4. 属性节点：标签里的属性 不会独立出现也不会和任何一个节点产生父子级关系

获取节点

回顾：之前的通过类名、id、标签名、name属性等获取到的都是元素节点，接下来的方法获取到的是不限于元素节点。

childNodes
    父节点.childNodes   ***父节点是获取到的元素***
        返回值：所有的子节点
children
        父节点.children
        返回值：所有子元素节点
firstChild
        父节点.firstChild
        返回值：第一个子节点
firstElement
        父节点.firstElement
        返回值：第一个子元素节点
lastChild
        父节点.firstChild
        返回值：最后一个子节点
lastElement
        父节点.firstElement
        返回值：最后一个子元素节点
previousSibling
        节点.previousSibling
        返回值：前一个兄弟节点
previousElementSibling
        节点.previousElementSibling
        返回值：前一个兄弟元素节点
nextSibling
        节点.nextSibling
        返回值：下一个兄弟节点
nextElementSibling
        节点.nextElementSibling
        返回值：下一个兄弟元素节点
parentNode
        节点.parentNode
        返回值：当前元素的父节点
parentElement
        节点.parentElement
        返回值：当前元素的父元素节点
attributes
        节点.attributes
        返回值：当前元素的属性节点

节点的操作

创建节点
    1.创建元素节点
        document.createElement（要创建的元素）
    2.创建文本节点
        document.createTextNode（要书写的内容）
替换节点
    父节点.replaceChild(换上节点，换下节点)
删除节点
    父节点.removeChild(要删除的节点)
    节点.remove()   //删除节点自己
克隆节点
    节点.colneNode(参数)
        参数：true 克隆后代
        参数：false 不克隆后代
插入节点   
    父节点.appendChild(你要插入的子节点)    就是把节点插入到父节点的最后面
    父节点.insertBefore(要插入的子节点，谁的前面)    

节点的属性

nodeType：
    元素节点.nodeType是1
    属性节点.nodeType是2
    文本节点.nodeType是3
    注释节点.nodeType是8
nodeName：
    元素节点.nodeName是大写标签名   //例：DIV
    属性节点.nodeName是属性名       //例：class
    文本节点.nodeName是#text
    注释节点.nodeName是#comment
nodeValue：
    元素节点.nodeValue是null
    属性节点.nodeValue是属性值
    文本节点.nodeValue是文本节点的内容
    注释节点.nodeValue是注释节点的内容