DOM文档对象模型

每一个HTML文档都被组织成为一个树状结构，每一个HTML文档对应一个树状结构。

DOM数的每一个内容称为节点，节点分为document节点、属性节点和文本节点、注释节点。

document节点在最顶层，document节点对应整个HTML文档，是操作其他节点的入口。

每一个节点都是一个对应类型的对象。

元素节点

通过DOM对文档执行插入、修改、删除等等操作

获取元素的方法：

1. document.getElementById
2. document.getElementsByName
3. document.getElementsByTagName
4. document.getElementsByClassName
5. document.querySelectorAll
6. document.querySelector

getBoundingClientRect()方法获取元素对于浏览器窗口的位置。

offsetWidth和offsetHeight分别获取元素的宽度和高度【包含边框】。

clientWidth和clientHeight获取元素不包含边框的宽度和高度。

创建元素节点：document.createElement(“节点名”)

创建文本节点：document.createTextNode()

创建属性节点：
document.createAttribute()

innerHTML设置元素节点内容

element.appendChild(‘子节点’)

element.insertBefore(‘新节点’)

element.replaceChild(新节点,旧节点)，替换节点

element.removeChild()，删除节点

DOM克隆节点,cloneNode():

节点对象.cloneNode(true)

其中的参数true，是可选项，如果想克隆子节点，就必须添加传参数true。

form对象常用的属性

表单的方法：

1. reset()
2. submit()

document.forms[0],0表示表单的第一个表单元素

document.formName:获取表单的name属性