📅  最后修改于: 2023-12-03 15:01:12.403000             🧑  作者: Mango
在HTML和JavaScript中,块引用对象是指可以用于引用HTML元素或文档中某些文本的对象。HTML | DOM块引用对象定义了一组属性和方法,可以让开发者查询和操作HTML文档中的内容。
Document对象表示当前HTML文档,它是HTML DOM中最基本的块引用对象。通过Document对象,可以获取HTML文档中任何元素以及文本节点。以下是Document对象上一些最常用的方法和属性:
// 获取文档的标题
document.title
// 获取文档中的所有元素
document.all
// 获取文档的根元素
document.documentElement
// 获取文档中的第一个元素
document.firstChild
// 获取文档中的最后一个元素
document.lastChild
// 查找文档中的元素
document.getElementById()
// 查找文档中的元素列表
document.getElementsByTagName()
// 查找文档中的元素列表
document.getElementsByClassName()
// 创建一个新的元素
document.createElement()
// 创建一个新的文本节点
document.createTextNode()
// 往文档中插入一个节点
document.appendChild()
// 从文档中移除一个节点
document.removeChild()
// 替换文档中的一个节点
document.replaceChild()
// 获取文档的URL
document.URL
// 获取文档的域名
document.domain
// 获取文档的cookie
document.cookie
// 获取文档的referrer
document.referrer
Element对象代表HTML文档中的一个元素,可以使用它来查询和操作指定元素。以下是Element对象上一些最常用的方法和属性:
// 获取元素的标签名
element.tagName
// 获取元素的class属性
element.className
// 获取元素的id属性
element.id
// 获取元素的style属性
element.style
// 获取元素的title属性
element.title
// 获取元素的dataset属性
element.dataset
// 获取元素的innerHTML属性
element.innerHTML
// 获取元素的innerText属性
element.innerText
// 获取元素的outerHTML属性
element.outerHTML
// 获取元素的innerText属性
element.outerText
// 获取元素的文本节点
element.textContent
// 获取元素在文档中的位置
element.getBoundingClientRect()
// 获取元素的子元素列表
element.children
// 获取元素的父元素
element.parentNode
// 获取元素的下一个兄弟元素
element.nextElementSibling
// 获取元素的上一个兄弟元素
element.previousElementSibling
// 获取元素的属性值
element.getAttribute()
// 设置元素的属性值
element.setAttribute()
// 查找元素中的第一个子元素
element.firstElementChild
// 查找元素中的最后一个子元素
element.lastElementChild
// 查找元素中的第一个子节点
element.firstChild
// 查找元素中的最后一个子节点
element.lastChild
// 插入一个元素到当前元素的前面
element.insertBefore()
// 插入一个元素到当前元素的后面
element.insertAfter()
// 替换元素
element.replaceChild()
// 删除当前元素
element.remove()
// 删除当前元素的一个子元素
element.removeChild()
// 添加一个子元素
element.appendChild()
Text对象表示一个文本节点,可以处理HTML文档中的纯文本内容。以下是Text对象上一些最常用的方法和属性:
// 获取文本节点的所有内容
textNode.textContent
// 获取文本节点的父元素
textNode.parentNode
Comment对象表示HTML文档中的注释。以下是Comment对象上一些最常用的方法和属性:
// 获取注释节点的内容
commentNode.textContent
// 获取注释节点的父元素
commentNode.parentNode
以上是HTML | DOM块引用对象的简单介绍和示例代码,希望对开发者的理解和使用有所帮助。