DOM提供了对HTML文档中元素、属性以及文本的一系列操作方法和属性。
通过对HTML节点的操作来实现相应的效果及交互。
节点分三类：元素节点、属性节点、文档节点，其中元素节点最为重要，后面两种节点依赖于元素节点。
元素节点的获取：
旧的查找方案：document.body【可直接拿到body元素】 document.forms【可拿到所有form表单】 document.href【可拿到所有带href属性的元素】
方法：
document.getElementByClassName(" ")
document.getElementById(" ")
document.getElementByTagName(" ")
【返回伪数组】
方法（ES6）：
document.querySelector(" ")
document.querySelectorAll(" ")
通过元素之间的关系查找：
element.parentElement
element.firstElementChild
element.lastElementChild
element.children
element.previousElementSibling
element.nextElementSibling
操作元素节点：创建、添加，删除，替换，克隆。
创建的节点并没有添加到HTML文档中，需要添加后才展现在HTML文档里。
element.cloneNode( )【（）里填写true为深克隆，会将克隆元素的标签内容一起复制，否则只复制标签】
文本节点内容的获取：
textNode.nodeValue【不常用】
elementNode.innerText【获取元素下所有文本，只能修改文本，不能修改标签】
elementNode.innerHTML【获取元素下所有节点（包括注释节点），能修改添加标签】
属性节点的操作：
elementNode.attributeName【for 属性需写成：htmlFor class属性需要写成：className】
elementNode..attributes【获取某个元素下所有属性节点】
操作方法：
element.getAttribute(" ")【获取元素节点】
element.setAttribute(" ")【设置】
element.removeAttribute(" ")【删除】
element.hasAttribute(" ")【是否存在】
自定义属性：
在HTML里为某些同级相同标签添加以data-开头的自定义属性，这样在dom里可以通过dataset属性即可操作元素节点
原文：https://www.cnblogs.com/freeland/p/11965793.html