IT源码网

怎样理解Node对象接口讲解

leader 2021年03月09日 编程语言 202 0

dom中的节点都继承自Node接口, 也就是说, 所有的节点都具有Node接口所规定的属性和方法, 比如下面这个 <a> 标签, 它也继承了Node的所有属性和方法: 

 

 

可以认为Node接口所规定的方法和属性是操作DOM的基础, 因此格外重要. 下面是它的所有属性和方法: 

属性
Node.prototype.nodeType  ---  返回一个整数值,表示节点的类型

Node.prototype.nodeName  ---  返回节点的名称

Node.prototype.nodeValue  ---  返回一个字符串,表示当前节点本身的文本值,该属性可读写

Node.prototype.textContent  ---  返回当前节点和它的所有后代节点的文本内容

Node.prototype.baseURI  ---  返回一个字符串,表示当前网页的绝对路径。浏览器根据这个属性,计算网页上的相对路径的 URL, 该属性为只读

Node.prototype.ownerDocument  ---  返回当前节点所在的顶层文档对象,即document对象

Node.prototype.nextSibling  ---  返回紧跟在当前节点后面的第一个同级节点

Node.prototype.previousSibling  ---  返回当前节点前面的、距离最近的一个同级节点

Node.prototype.parentNode  ---  返回当前节点的父节点

Node.prototype.parentElement  ---  返回当前节点的父元素节点

Node.prototype.firstChild,Node.prototype.lastChild  ---  返回当前节点的第一个 / 最后一个子节点

Node.prototype.childNodes  ---  返回一个类似数组的对象(NodeList集合),成员包括当前节点的所有子节点

Node.prototype.isConnected  ---  返回一个布尔值,表示当前节点是否在文档之中

 

方法
Node.prototype.appendChild()  ---  接受一个节点对象作为参数,将其作为最后一个子节点,插入当前节点

Node.prototype.hasChildNodes()  ---  返回一个布尔值,表示当前节点是否有子节点

Node.prototype.cloneNode()  ---  用于克隆一个节点

Node.prototype.insertBefore()  ---  将某个节点插入父节点内部的指定位置

Node.prototype.removeChild()  ---  接受一个子节点作为参数,用于从当前节点移除该子节点

Node.prototype.replaceChild()  ---  用于将一个新的节点,替换当前节点的某一个子节点

Node.prototype.contains()  ---  返回一个布尔值,表示参数节点是否满足某种条件

Node.prototype.compareDocumentPosition()  ---  与contains方法完全一致,返回一个六个比特位的二进制值,表示参数节点与当前节点的关系

Node.prototype.isEqualNode(),Node.prototype.isSameNode()  ---  返回一个布尔值,用于检查两个节点是否相等 / 同一节点

Node.prototype.normalize()  ---  用于清理当前节点内部的所有文本节点(text)

Node.prototype.getRootNode()  ---  返回当前节点所在文档的根节点document,与ownerDocument属性的作用相同

 

发布评论
IT源码网

微信公众号号:IT虾米 (左侧二维码扫一扫)欢迎添加!

怎样理解 DOM 的三种层级关系讲解
你是第一个吃螃蟹的人
发表评论

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。