DOM 相关对象属性和方法

首页 > DOM 相关对象属性和方法 > 列表

DOM 相关对象属性和方法

NodeList 接口,HTMLCollection 接口

节点都是单个对象,有时需要一种数据结构,能够容纳多个节点。DOM 提供两种节点集合,用于容纳多个节点:NodeList和HTMLCollection。

这两种集合都属于接口规范。许多 DOM 属性和方法,返回的结果是NodeList实例或HTMLCollection实例。主要区别是,NodeList可以包含各种类型的节点,HTMLCollection只能包含 HTML 元素节点。
NodeList 接口
概述
NodeList.prototype.length
NodeList.prototype.forEach()
NodeList.prototype.item()
NodeList.prototype.keys(),NodeList.prototype.values(),NodeList.prototype.entries()
HTMLCollection 接口
概述
HTMLCollection.prototype.length
HTMLCollection.prototype.item()
HTMLCollection.prototype.namedItem()



ParentNode 接口,ChildNode 接口
节点对象除了继承 Node 接口以外,还拥有其他接口。ParentNode接口表示当前节点是一个父节点,提供一些处理子节点的方法。ChildNode接口表示当前节点是一个子节点,提供一些相关方法。

目录 [隐藏]
ParentNode 接口
ParentNode.children
ParentNode.firstElementChild
ParentNode.lastElementChild
ParentNode.childElementCount
ParentNode.append(),ParentNode.prepend()
ChildNode 接口
ChildNode.remove()
ChildNode.before(),ChildNode.after()
ChildNode.replaceWith()



Document 节点
目录 [隐藏]
概述
属性
快捷方式属性
节点集合属性
文档静态信息属性
文档状态属性
document.cookie
document.designMode
document.currentScript
document.implementation
方法
document.open(),document.close()
document.write(),document.writeln()
document.querySelector(),document.querySelectorAll()
document.getElementsByTagName()
document.getElementsByClassName()
document.getElementsByName()
document.getElementById()
document.elementFromPoint(),document.elementsFromPoint()
document.createElement()
document.createTextNode()
document.createAttribute()
document.createComment()
document.createDocumentFragment()
document.createEvent()
document.addEventListener(),document.removeEventListener(),document.dispatchEvent()
document.hasFocus()
document.adoptNode(),document.importNode()
document.createNodeIterator()
document.createTreeWalker()
document.execCommand(),document.queryCommandSupported(),document.queryCommandEnabled()
document.getSelection()


Element 节点
简介
实例属性
元素特性的相关属性
元素状态的相关属性
Element.attributes
Element.className,Element.classList
Element.dataset
Element.innerHTML
Element.outerHTML
Element.clientHeight,Element.clientWidth
Element.clientLeft,Element.clientTop
Element.scrollHeight,Element.scrollWidth
Element.scrollLeft,Element.scrollTop
Element.offsetParent
Element.offsetHeight,Element.offsetWidth
Element.offsetLeft,Element.offsetTop
Element.style
Element.children,Element.childElementCount
Element.firstElementChild,Element.lastElementChild
Element.nextElementSibling,Element.previousElementSibling
实例方法
属性相关方法
Element.querySelector()
Element.querySelectorAll()
Element.getElementsByClassName()
Element.getElementsByTagName()
Element.closest()
Element.matches()
事件相关方法
Element.scrollIntoView()
Element.getBoundingClientRect()
Element.getClientRects()
Element.insertAdjacentElement()
Element.insertAdjacentHTML(),Element.insertAdjacentText()
Element.remove()
Element.focus(),Element.blur()
Element.click()



属性的操作

Element.attributes 属性
元素的标准属性
属性操作的标准方法
概述
Element.getAttribute()
Element.getAttributeNames()
Element.setAttribute()
Element.hasAttribute()
Element.hasAttributes()
Element.removeAttribute()
dataset 属性


Text 节点和 DocumentFragment 节点

Text 节点的概念
Text 节点的属性
data
wholeText
length
nextElementSibling,previousElementSibling
Text 节点的方法
appendData(),deleteData(),insertData(),replaceData(),subStringData()
remove()
splitText()
DocumentFragment 节点


CSS 操作

HTML 元素的 style 属性
CSSStyleDeclaration 接口
简介
CSSStyleDeclaration 实例属性
CSSStyleDeclaration 实例方法
CSS 模块的侦测
CSS 对象
CSS.escape()
CSS.supports()
window.getComputedStyle()
CSS 伪元素
StyleSheet 接口
概述
实例属性
实例方法
实例:添加样式表
CSSRuleList 接口
CSSRule 接口
概述
CSSRule 实例的属性
CSSStyleRule 接口
CSSMediaRule 接口
window.matchMedia()
基本用法
MediaQueryList 接口的实例属性
MediaQueryList 接口的实例方法