HTML DOM小结
HTML DOM 是关于如何获取、修改、添加或删除 HTML 元素的标准，在 HTML DOM 中，所有事物都是节点。DOM 是被视为节点树的 HTML。
一、DOM方法
一些常用的 HTML DOM 方法：
| 方法 | 描述 |
|---|---|
| getElementById() | 返回带有指定 ID 的元素。 |
| getElementsByTagName() | 返回包含带有指定标签名称的所有元素的节点列表（集合/节点数组）。 |
| getElementsByClassName() | 返回包含带有指定类名的所有元素的节点列表。 |
| appendChild() | 把新的子节点添加到指定节点。 |
| removeChild() | 删除子节点。 |
| replaceChild() | 替换子节点。 |
| insertBefore() | 在指定的子节点前面插入新的子节点。 |
| createAttribute() | 创建属性节点。 |
| createElement() | 创建元素节点。 |
| createTextNode() | 创建文本节点。 |
| getAttribute() | 返回指定的属性值。 |
| setAttribute() | 把指定属性设置或修改为指定的值。 |
二、DOM 属性
- innerHTML - 节点（元素）的文本值
- parentNode - 节点（元素）的父节点
- childNodes - 节点（元素）的子节点
- attributes - 节点（元素）的属性节点
- nodeName - 节点（元素）的名称
|
- nodeValue 属性规定节点的值
| 元素节点的 nodeValue 是 undefined 或 null 文本节点的 nodeValue 是文本本身 属性节点的 nodeValue 是属性值 |
- nodeType 属性返回节点的类型
| 元素类型 | NodeType |
|---|---|
| 元素 | 1 |
| 属性 | 2 |
| 文本 | 3 |
| 注释 | 8 |
| 文档 | 9 |
三、DOM 访问
- 通过使用document.getElementById() 方法
- 通过使用 document.getElementsByTagName() 方法
- 通过使用 document.getElementsByClassName() 方法
四、DOM 修改
修改 HTML DOM 意味着许多不同的方面：
- 改变 HTML 内容
- 改变 CSS 样式
- 改变 HTML 属性
- 创建新的 HTML 元素
- 删除已有的 HTML 元素
- 改变事件（处理程序）
改变元素内容：
使用 innerHTML 属性
改变HTML样式：
创建新的元素：
appendChild()
修改 HTML DOM 意味着许多不同的方面：
- 改变 HTML 内容
- 改变 CSS 样式
- 改变 HTML 属性
- 创建新的 HTML 元素
- 删除已有的 HTML 元素
- 改变事件（处理程序）
insertBefore：
appendChild() 方法，将新元素作为父元素的最后一个子元素进行添加，若不希望如此，则使用insertBefore()
删除元素：
removeChild：
或
替换元素：
