首先了解一下DOM中有三大節點，分別是 元素節點，文本節點，屬性節點
元素節點：構成了DOM的基礎。文檔結構中，<html>是根元素，代表整個文檔，其他的還有<head>,<body>,<p>,<span>等等。元素節點之間可以相互包含(當然遵循一定的規則)
文本節點：包含在元素節點中。
屬性節點：元素都可以包含一些屬性，屬性的作用是對元素做出更具體的描述，比如id,name之類的。
以下面的demo為例：
<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 屬性含有某個節點的名稱。
元素節點的 nodeName 是標簽名稱（返回的名稱是大寫的）
屬性節點的 nodeName 是屬性名稱（返回的名稱是大寫的）
文本節點的 nodeName 永遠是 #text
文檔節點的 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