1.NODE类型
DOM规定：整个文档时一个文档节点，每个html标签是一个元素节点 ，包含在html元素中的文本是文本节点。每个html属性是一个属性节点。主是属于 注释节点。
2.获取NODE的方式
a.通过获取元素的方式获取NODE
document.getElementById("Id")
document.getElementTagName("tagname")
document.getElementByName("name")
document.getElementClassName("classname")
b.通过NODE关系属性获得引用
parentNode 获取该元素的父节点
childNode 获取对象所有的子节点，只包含次级节点
firstChild 获取该元素的第一个子节点
lastChild 获取该元素的最后一个子节点
previouSibling 获取该元素上一个兄弟节点
nextSibling 获取该元素下一个兄弟节点
appendChild 向元素添加新的子节点，作为最后一个子节点
eg:
<body>
<ul id="myList"><li>milk</li><li>water</li></ul>
<ul id="myList"><li>milk</li><li>water</li></ul>
<ul id="myList"><li>milk</li><li>water</li></ul>
</body>
<button onclick="fn()">试试</button>
//返回首个子节点
function fn(){
var x=document.getElementById("myList");
console.log(x.firstChild.nodeName);
}
3.NODE属性
| 节点中文 | nodeType(节点类型) | nodeName(节点名) | nodeValue(节点值) |
|---|---|---|---|
| 元素 | 1 | TagName | null |
| 属性 | 2 | attr | 属性值 |
| 文本 | 3 | #text | 文本值 |
| 注释 | 8 | #comment | 注释文字 |
| 文档 | 9 | #document | null |
4.NODE 增 删 查 改
### 新增节点 ###
a.新建元素 --creatElement
b.新建文本 --creatTextNode
c.元素中新增文本 -- 标签
d.找到已有元素--->获取getElementById
e.新增标签（加入到新元素里面作为子节点）--appendChild
### 删除节点 ###
a.找父元素（节点）--getElementById---a
b.找到要删除的元素--getElementById---b
c.执行删除 --removeChild
b.parentNode.removeChild(b)
###改（替换节点） ##
a.replace(新，旧)
b.cloneNode()--属性及其值
c.insertBefore()--获取已有元素 插入新子节点