1、梳理知识点
window对象： location....
window对象方法 ：
定时器 ：
document对象 ：
document.getElementsByTagName() 集合
document.querySelector("#box") .box div
document.body document.documentElement
操作页面元素 ：
操作样式
className = "类名"
操作属性
操作内容
innerHTML / innerText
value
location : 页面跳转 location.href
2、dom document object model (DOM 文档对象模型)
html是dom结构的根节点
html元素是 元素节点
元素的属性叫做 属性节点
元素的内容叫做 文本节点
一切都是节点
节点关系 （了解）：
parentNode 父节点
children 孩子节点
childNodes 孩子节点 childNodes 会将换行识别成文本节点
firstElementChild 第一个孩子节点
lastElementChild 最后一个孩子节点
nextElementSibling 下一个兄弟节点
previousElementSibling 前一个兄弟节点
节点类型 ： nodeType
只有三种情况
元素节点 1
文本节点 3
属性节点 2
tagName 或 nodeName 获取查找到的元素的标签名
3、节点的动态操作（重点） 创建 添加 删除
1、动态创建节点
document.createElement("标签名")
document.createTextNode() 创建文本节点 （了解）
2、动态添加节点
appendChild() 用法 ： 父元素.appendChild( 要添加的子元素 )
一定是父子关系,且默认往后追加
insertBefore() 用法 ： 父元素.insertBefore( 要添加的子元素 , 参照节点 )
将要添加的子元素 添加 到参照节点的前面,如果参照节点是null 则和appendChild效果相同
3、删除
removeChild()
父元素.removeChild( 要删除的子元素 )
remove()
要删除的元素.remove()
4、节点克隆
cloneNode( true )
没有参数，表示只克隆元素本身 如果参数为true，即克隆元素本身，又克隆元素的内容
5、节点属性的操作
getAttribute() 获取元素的属性值 （包含自定义属性）
setAttribute() 设置元素的属性 （为某个元素添加新的属性） （了解）