DOM節點信息包括節點類型（nodeType）、節點名稱（nodeName）和節點值（nodeValue）。

節點類型

DOM節點中，每個節點都擁有不同的類型。

W3C規范中常用的 DOM節點類型有以下幾種：
節點類型 說明 值

元素節點	每一個HTML標簽都是一個元素節點，如 <div> 、 <p>、<ul>等	1
屬性節點	元素節點（HTML標簽）的屬性，如 id 、class 、name 等。	2
文本節點	元素節點或屬性節點中的文本內容。	3
注釋節點	表示文檔注釋，形式為<!-- comment text -->。	8
文檔節點	表示整個文檔（DOM 樹的根節點，即 document?）	9

獲取節點類型的語法：
? ? nodeObject.nodeType
其中，nodeObject 為DOM節點（節點對象）。該屬性返回以數字表示的節點類型，例如，元素節點返回 1，屬性節點返回 2 。

例如，獲取id="demo"的<div>標簽的節點類型：

document.getElementById("demo").nodeType;

該語句的返回值為 1 。

舉例，獲取元素節點和文本節點的類型值：

<div id="demo1">點擊這里顯示節點類型</div>

<script type="text/javascript">

document.getElementById("demo1").onclick=function(){

var divType=this.nodeType;

var textType=this.firstChild.nodeType; ?//? this 指當前發生事件的HTML元素，這里是<div>標簽

alert(

"<div>標簽的節點類型是："+divType+"\n"+

"<div>標簽內部文本的節點類型是："+textType

);

}

</script>

請看演示： 點擊這里顯示節點類型

節點名稱

節點名稱就是DOM節點的名字，不同類型的節點對應不同的節點名稱。
節點類型 節點名稱

元素節點	HTML標簽的名稱（大寫）
屬性節點	屬性的名稱
文本節點	它的值永遠是#text
文檔節點	它的值永遠是#document

獲取節點名稱的語法：
? ? nodeObject.nodeName
其中，nodeObject 為DOM節點（節點對象）。

例如，獲取id="demo"的<div>標簽的節點名稱：

document.getElementById("demo").nodeName;

該語句的返回值為 DIV 。

舉例，獲取元素節點名稱、文本節點名稱和文檔節點名稱：

<div id="demo2">點擊這里顯示節點名稱</div>

<script type="text/javascript">

document.getElementById("demo2").onclick=function(){

var divName=this.nodeName;

var textName=this.firstChild.nodeName; ?//? this 指當前發生事件的HTML元素，這里是<div>標簽

var documentName=document.nodeName

alert(

"<div>標簽的節點名稱是："+divName+"\n"+

"<div>標簽內部文本的節點名稱是："+textName+"\n"+

"文檔節點的節點名稱是："+documentName

);

}

</script>

請看下面的演示：
點擊這里顯示節點名稱

節點值

對于文本節點，節點值為文本內容；對于屬性節點，節點值為屬性的值。

節點值對于文檔節點和元素節點是不可用的。

獲取節點值的語法：
? ? nodeObject.nodeValue
其中，nodeObject 為DOM節點（節點對象）。

舉例，獲取文本節點的節點值：

<div id="demo3">點擊這里顯示文本節點的值</div>

<script type="text/javascript">

document.getElementById("demo3").onclick=function(){

alert(this.firstChild.nodeValue); ?//? this 指當前發生事件的HTML元素，這里是<div>標簽

}

</script>

請看下面的演示： 點擊這里顯示文本節點的值

總結

以上是生活随笔為你收集整理的JavaScript获取节点类型、节点名称和节点值的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。