13. DOM绘制DOM树 ：
DOM操作：
*绘制DOM树：childNodes,attributes（属性节点）
*从一个中心元素，访问所有的直系亲属元素
*访问父元素：parentNode
*访问上一个兄弟节点：previousSibling
*访问下一个兄弟节点：nextSibling
*访问第一个属性节点：attributes[ 1 ]
*访问最后一个子节点：lastChild 或 childNodes[ childNodes.length - 1 ]
从一个中心元素访问其所有的直系亲属元素
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>测试</title>
</head>
<body>
<div>
<!--测试-->
你好我是一个<span styel="color: red">div</span> 标签
</div>
</body>
</html>DOM操作：
## 访问由于树关系（ 节点 ）
## 方法与功能
* 核心内容就是利用 增删改查
* 查询
就是获取元素
1. 标准DOM API
document.getElementById
document.getElementsByTagName
document.getElementsByName
document.getElementsByClassName
Document.querySelectorAll
2.亲属访问
3. 属性获取
getAttribute
getAttributeNode
*增加
1.创建
doucment.createEelement 创建元素节点
doucment.createTextNode 创建文本节点
Doucment.createattribute 属性节点
innerHTML
innerText
cloneNode()
2. 加入
appendChild 追加到结尾处
innerHTML
insertBefore 用法将元素插入到某一个元素的 前面
父元素.insertBefore ( 新元素，旧元素 )；
// 将新元素 插入到 旧元素的前面
3.其它
Style 的属性
setAttribute ( 属性名， 属性值 )
*删除
1. 删除元素
removeChild
removeAttributeNode
*修改
1.修改节点
删除节点再加入
2.修改样式
style.xxx = vvv;
setAttribute
3.修改文本
innerHTML
innerText
节点操作
nodeValue
4.修改属性
.xxx = vvv
setAttribute