nodeType、nodeName和nodeValue

时间 2019-12-14

标签 nodetype nodename nodevalue 繁體版

原文原文链接

首先了解一下DOM中有三大节点，分别是元素节点，文本节点，属性节点html

元素节点：构成了DOM的基础。文档结构中，<html>是根元素，表明整个文档，其余的还有<head>,<body>,<p>,<span>等等。元素节点之间能够相互包含(固然遵循必定的规则)node

文本节点：包含在元素节点中。ui

属性节点：元素均可以包含一些属性，属性的做用是对元素作出更具体的描述，好比id,name之类的。spa

如下面的demo为例：code

<script>
window.onload = function(){
  　　var element = document.getElementById("span");
  　　var text = element.firstChild;
  　　var property=document.getElementById("span").getAttributeNode("id");
}
</script>

<body>
　　<div>
　  　　<span id="span">文本节点</span>
　　</div>
</body>

(一)nodeName 属性含有某个节点的名称。htm

元素节点的 nodeName 是标签名称（返回的名称是大写的）blog

属性节点的 nodeName 是属性名称（返回的名称是大写的）ip

文本节点的 nodeName 永远是 #textelement

文档节点的 nodeName 永远是 #document文档

注释：nodeName 所包含的 XML 元素的标签名称永远是大写的

alert("这是元素节点的返回值："+ element.nodeName);//返回的标签名SPAN,注意是大写的
alert("这是文本节点的返回值："+ text.nodeName);//返回的#text
alert("这是属性节点的返回值："+ property.nodeName);//返回的是属性名，这里是id

(二)nodeValue

对于文本节点，nodeValue 属性包含文本。

对于属性节点，nodeValue 属性包含属性值。

nodeValue 属性对于文档节点和元素节点是不可用的。

alert("这是元素节点的返回值："+ element.nodeValue);//自己就没有意义，这里是试验下的，返回的是null
alert("这是文本节点的返回值："+ text.nodeValue);//返回的是文本值  文本节点
alert("这是属性节点的返回值："+ property.nodeValue);//返回的是属性值，这里是id的属性值span

(三)nodeType

nodeType 属性可返回节点的类型。

咱们经常使用的3中类型：
nodeType == 1  ：元素节点
nodeType == 2  ：属性节点
nodeType == 3  ：文本节点

注释 comments 8

文档 document 9

  alert("这是元素节点的返回值："+ element.nodeType);//元素节点返回1
  alert("这是文本节点的返回值："+ text.nodeType);//文本节点返回3
  alert("这是属性节点的返回值："+ property.nodeType);//属性节点返回2

___________________________

原文：http://www.tuicool.com/articles/zANnye