name 方法或属性 类型 等级 使用场景 读写 作用 备注
document.doctype P Document 了解 只读 获取doctype元素引用
document.documentElement P Document 常用 获取元素引用 只读 获取html元素引用
document.body P Document 常用 获取元素引用 只读 获取body元素引用
document.head P Document 不常用 获取元素引用 只读 获取第一个head元素引用
document.title P Document 不常用 读写 获取title元素的内容
document.URL P Document 了解 只读 当前的网站的网址
document.domain P Document 了解 读写 当前的域名
document.referer P Document 了解 只读 从哪里跳转来的网址
document.getElementById() M Document 常用 获取元素引用 通过id获取某个元素(全文档搜索)
document.getElementsByClassName() M Document 常用 获取元素引用 通过class类名 获取 元素们(全文档搜索)
document.getElementsByName() M Document 不常用 获取元素引用 通过name属性的值 获取 元素们(全文档搜索)
document.getElementsByTagName() M Document 常用 获取元素引用 通过标签名(元素名) 获取 元素们(全文档搜索) 静态
document.querySelector() M Document 常用 获取元素引用 通过css选择器的写法来获取某个元素
如果有很多个符合只取到第一个(全文档搜索)
document.querySelectorAll() M Document 常用 获取元素引用 通过css选择器的写法来获取某些元素 (全文档搜索)
Element.getElementsByClassName() M Element 不常用 获取元素引用 通过class类名 获取 元素们(只搜索调用该方法的元素的子元素)
Element.getElementsByTagName() M Element 不常用 获取元素引用 通过标签名(元素名) 获取 元素们(只搜索调用该方法的元素的子元素) 静态
Element.querySelector() M Element 不常用 获取元素引用 通过css选择器的写法来获取某个元素
如果有很多个符合只取到第一个
(只搜索调用该方法的元素的子元素)
Element.querySelectorAll() M Element 不常用 获取元素引用 通过css选择器的写法来获取某些元素
(只搜索调用该方法的元素的子元素)
Element.tagName P Element 不常用 只读 元素的标签名
Element.attributes P Element 不常用 只读 元素的所有属性的类数组
Element.children P Element 了解 只读 元素的子元素们-限html类型的标签元素
Element.childElementCount P Element 了解 只读 元素的子元素们数量-限html类型的标签元素
Element.firstElementChild P Element 了解 只读 元素的第一个子元素-限html类型的标签元素
Element.lastElementChild P Element 了解 只读 元素的最后一个子元素-限html类型的标签元素
Node.nodeName P Node 不常用 只读 节点的名称 就是标签名
Node.nodeValue P Node 不常用 读写 节点的值
Node.nodeType P Node 不常用 只读 节点类型
Node.parentNode P Node 常用 元素之间关系 只读 父节点
Node.previousSibling P Node 常用 元素之间关系 只读 前一个节点
Node.nextSibling P Node 常用 元素之间关系 只读 后一个节点
Node.firstChild P Node 常用 元素之间关系 只读 第一个子节点
Node.childNodes P Node 重要 元素之间关系 只读 所有子节点(包括文本类型节点)
Node.hasChildNodes() M Node 不常用 元素之间关系 判断有没有子节点
Node.contains() M Node 不常用 元素之间关系 判断是否包含某个传入的节点
HTMLElement.style P HTMLElement 重要 元素样式修改 只读 元素的样式 对象数据的形式 可以用来修改相应样式
Element.classList P Element 重要 元素样式修改 只读 元素的对象class类名的一个对象 add toggle remove
Element.className P Element 不常用 元素样式修改 读写 元素的类名
Element.getAttribute() M Element 不常用 获取调用的元素的某个属性的值
Element.setAttribute() M Element 不常用 设置调用的元素的某个属性的值
Element.removeAttribute() M Element 不常用 删除调用元素的某个属性
Element.hasAttribute() M Element 不常用 判断调用的元素是否有某个属性
HTMLElement.innerText P HTMLElement 常用 元素内部替换 读写 元素内的所有文字
Element.innerHTML P Element 常用 元素内部替换 读写 元素内所有html文本 包含文字
Element.outerHTML P Element 不常用 元素内部替换 读写 元素本身及内部所有html文本 包含文字
Element.id P Element 常用 读写 元素的id值
HTMLElement.title P HTMLElement 不常用 读写 元素的title属性值
HTMLElement.hidden P HTMLElement 不常用 读写 元素的可见性
document.createElement() M Document 常用 创建元素相关 根据传入的标签名来创建某个html元素
document.createTextNode() M Document 常用 创建元素相关 根据传入的字符创建相应的文本节点
document.createAttribute() M Document 不常用 创建元素相关 根据传入的属性名创建相应的属性节点
Element.setAttributeNode() M Element 了解 创建元素相关 把某个属性节点设置到调用该方法的元素上
Element.getAttributeNode() M Element 了解 创建元素相关 获取调用该方法的元素上的指定的属性节点
Node.appendChild() M Node 重要 创建元素相关 添加到 调用该方法的节点的子节点中的最后一位
Node.insertBefore() M Node 常用 创建元素相关 把某个元素添加到 调用该方法的元素自己某个子节点前面(注意 调用该方法的是作为参考元素的父元素)
Node.removeChild() M Node 不常用 创建元素相关 删除某个子节点
Node.replaceChild() M Node 不常用 创建元素相关 替换某个子节点
Node.normalize() M Node 了解 把节点中的文本节点合并成一个节点
HTMLElement.dataset P HTMLElement 重要 只读 元素上的自定义数据 通过这个取到的对象获取
document.createDocumentFragment() M Document 不常用 创建一个文档片段节点
Element.insertAdjacentHTML() M Element 了解 以标签的符号为参考位置插入HTML文本
Element.insertAdjacentText() M Element 了解 以标签的符号为参考位置插入文字内容
Node.isEqualNode() M Node 了解 判断是否为完全相等节点
Node.ownerDocument P Node 了解 只读
Node.cloneNode() M Node 了解 创建元素相关 克隆节点
CharacterData.length P CharacterData 了解 只读
CharacterData.data P CharacterData 了解 读写
CharacterData.appendData() M CharacterData 了解 给节点添加数据
Element.previousElementSibling P Element 了解 只读 前一个兄弟节点 - 限元素节点(html相关元素)
Element.nextElementSibling P Element 了解 只读 后一个兄弟节点 - 限元素节点(html相关元素)

来源:https://mumumus.notion.site/b41e36f3f7264e32b94a539a9d692ae2?v=6b66a039fad74d8db1f1e9ff090cae47