DOM中查找、添加、删除元素的常用方法
查找 HTML 元素
| 方法 | 简介 |
|---|---|
| document.getElementById(id) | 通过元素 id 来查找元素 |
| document.getElementsByTagName(name) | 通过标签名来查找元素返回的元素节点的数组 |
| document.getElementsByClassName(name) | 通过类名来查找元素使用指定的calss属性值(名称)返回当前文档中所有相关元素的数组(节点列表对象) |
| getElementsByName() | 通过name获取一组元素节点对象 |
| childNodes | 获取当前元素的子节点 |
| children | 获取当前元素的所有子元素(注意不是节点) |
| firstChild | 可以获取到当前节点的第一个子节点 |
| firstElementChild | 可以获取当前元素的第一个子元素 。但是不支持IE8以下的浏览器 |
| lastChild | 可以获取到当前节点的最后一个子节点 |
| parentNode | 表示当前节点的父节点 |
| previousSibling | （可能会取到空白的文本） 表示当前节点的前一个兄弟节点 |
| nextSibling | 表示当前节点的后一个兄弟节点 |
| innerText | 该属性可以获取到元素内部的文本内容他和innerHTML类似，不同的是他会自动将html标签去除 |
| previousElementSibling | 获取前一个兄弟元素，但是IE8及以下不支持 |
| nodevalue | 获取节点的文本 |
添加和删除元素
| 方法 | 简介 |
|---|---|
| document.createElement(element) | 创建 HTML 元素 |
| document.removeChild(element) | 删除 HTML 元素 |
| document.appendChild(element) | 添加 HTML 元素 |
| document.replaceChild(element) | 替换 HTML 元素 |
| document.write(text) | 写入 HTML 输出流 |
