Javascript入門學習第八篇 js dom節點屬性說明第1/2頁

今天我們講DOM屬性。
前面其實我們已經碰過DOM屬性了。
比如：
nodeName，nodeType…..今天我們詳細的講解下。

1，nodeName屬性 ： 節點的名字。
如果節點是元素節點，那麼返回這個元素的名字。此時，相當於tagName屬性。
比如：
<p>aaaa</p> : 則返回 p ;
如果是屬性節點，nodeName將返回這個屬性的名字。
如果是文本節點，nodeName將返回一個#text的字串。

另外我要說的是： nodeName屬性是一個唯讀屬性，不能進行設定.(寫)
它返回 大寫字母的值。

2,,nodeType屬性 ： 返回一個整數，代表這個節點的類型。
我們常用的3中類型：
nodeType == 1 ： 元素節點
nodeType == 2 ： 屬性節點
nodeType == 3 ： 文本節點
如果想記住的話，我們可以這麼去記：
比如： <p title="cssrain" >test</p> 從前往後讀： 你會發現 先是元素節點(1)，然後是屬性節點(2)，最後是文本節點(3)，這樣你就很容易記住了 nodeType分別代表什麼類型了。（我總結的一點小技巧， ^_^。）

nodeType屬性經常跟 if 配合使用，以確保不會在錯誤的節點類型上 執行錯誤的操作。
比如：
function cs_demo(mynode){
if(mynode.nodeType == 1){
mynode.setAttribute("title","demo");
}
}
代碼解釋： 先檢查mynode的nodeType屬性，以確保它所代表的節點確實是 一個元素節點。
和nodeName屬性一樣，他也是唯讀屬性，不能進行設定.(寫)。

3，nodeValue屬性 ： 返回一個字串，這個節點的值。
如果節點是元素節點，那麼返回null；（注意下）
如果是屬性節點，nodeValue將返回這個屬性的值。
如果是文本節點，nodeValue將返回這個文本節點的內容。
比如：
<div id="c">aaaaaaaaaaaaaaaa</div>
<SCRIPT LANGUAGE="JavaScript">
var c= document.getElementById("c");
alert( c.nodeValue );//返回null
</SCRIPT>
nodeValue是一個可以讀、寫的屬性。 但它不能設定元素節點的值。
再看看下面的例子：
<div id="c">aaaaaaaaaaaaaaaa</div>
<SCRIPT LANGUAGE="JavaScript">
var c= document.getElementById("c");
c.nodeValue =" dddddddddddd"; //不能設定
//alert( c.firstChild.nodeValue ) //元素節點 包括屬性節點和文本節點。
c.firstChild.nodeValue = "test"//能設定
</SCRIPT>
當然我們為了確保能正確運行：可以加一段代碼：
<div id="c">aaaaaaaaaaaaaaaa</div>
<SCRIPT LANGUAGE="JavaScript">
var c= document.getElementById("c");
c.nodeValue =" dddddddddddd"; //不能設定
//alert( c.firstChild.nodeValue )
if( c.firstChild.nodeType==3 ){ //判斷是不是 文本節點
c.firstChild.nodeValue = "test"//能設定
}
</SCRIPT>
//可以看出，如果要設定元素節點，不能直接設定，而必須先使用firstChild或者lastChild等 然後設定nodeValue.
nodeValue一般只用來設定 文本節點的值。如果要重新整理屬性節點的值，一般使用setAttribute().