---恢复内容开始---
一、节点
dom与dom树
DOM：文档对象模型 => 提高给用户操作document obj的标准接口
DOM树：以document为根，树状展开所有子节点
节点分类
节点分类：6个
document | doctype | element | text | attr | comment
节点常规操作
var info_node = document.createAttribute("info"); //创建
console.log(info_node.nodeName);
console.log(info_node.nodeType);
info_node.value = '123'; //设置
console.log(info_node.nodeValue);
sup1.setAttributeNode(info_node); //添加
二、文档结构（element元素范围）
// 父级
console.log(sup.parentElement);
// 子级们
console.log(sup.children);
// 第一个子级
console.log(sup.firstElementChild);
// 最后一个子级
console.log(sup.lastElementChild);
// 上兄弟
console.log(sup.previousElementSibling);
// 下兄弟
console.log(sup.nextElementSibling);
// 注：文档结构操作是可以采用连.语法
// sup.children[0].parentElement //子级
三、文档元素节点操作
// 操作步骤
1.创建div(元素节点)
2.设置div属性(单一css | css类名 | 文本 | 子标签 | 事件 | 。。。)
3. 添加到(文档结构中)指定位置
创建：只能由document调用
var box = document.createElement('div');
在body元素的最后追加一个子元素
body.appendChild(box);
在body元素oldEle之前插入一个子元素
body.insertBefore(box, oldEle);
从body中删除box元素，可以接受返回值，就是删除的元素
var res = body.removeChild(div);
将body中oldEle元素替换为box，可以接受返回值，就是被替换的元素
res = bodyreplaceChild(box, oldEle);
true深拷贝，拷贝自身与内容，false浅拷贝，只拷贝自身标签
box.cloneNode()
四、事件对象target属性
ev.target通过父级的事件对象，获取具体相应区域位置的子级元素
应用场景
1、父级的子元素类型不统一，采用循环绑定不方便
2、父级子元素较多或不确定
五、BOM操作
BOM： Browser Object Model, 提供用户与浏览器交互的标准接口
BOM的顶级对象为window对象，页面中出现的其它所有对象都是window的子对象
重要的子对象
document | history | location | navigator | screen
location => url信息
console.log(location);
域名：端口号
console.log(location.host);
域名
console.log(location.hostname);
端口号
console.log(location.port);
查询信息
console.log(location.search);
history
history.back() | history.forward() | history.go(-num | num)
navigator
console.log(navigator.userAgent)
---恢复内容结束---