element.childNodes 返回一個數組,這個數組包含給定元素節點的全體子元素
var element = document.getElementsByTagName("ul");
var oElement = element[0].childNodes;
for(var i = 0; i < oElement.length; i++){
alert(typeof oElement[i]);
}
##RM##
nodeType 屬性
node.nodeType 返回一個數值
nodeType 屬性總共有12種可取值,但其中僅有3種具有使用價值:元素節點、屬性節點、文本節點的 nodeType 的屬性值分別是 1、2、3。
元素節點的 nodeType 屬性值是 1。
屬性節點的 nodeType 屬性值是 2。
文本節點的 nodeType 屬性值是 3。
var element = document.getElementsByTagName("ul");
var oElement = element[0].childNodes;
for(var i = 0; i < oElement.length; i++){
alert(oElement[i].nodeType);
}
nodeValue 屬性
node.nodeValue 檢索或設置節點的值
var text = document.getElementsByTagName("p");
alert(text[0].childNodes[0].nodeValue);
text[0].childNodes[0].nodeValue = "OK-value";
alert(text[0].childNodes[0].nodeValue);
nodeName 屬性
node.nodeName 返回一個大寫字符串(節點名)
var name = document.getElementsByTagName("p");
alert(name[0].nodeName);
firstChild 屬性
node.firstChild 直接訪問childNodes[]數組的第一個元素
var parent = document.getElementsByTagName("p");
var child = parent[0].firstChild;
alert(child.nodeValue);
lastChild 屬性
node.lastChild 直接訪問childNodes[]數組的最後一個元素
var parent = document.getElementsByTagName("p");
var child = parent[0].lastChild;
alert(child.nodeValue);
Examples:
<p>Hello World!<span>OK!!!</span></p>
<script type="text/javascript">
<!--
var element = document.getElementsByTagName("p");
var childs = element[0].childNodes;
for(var i = 0; i < childs.length; i++){
alert(childs[i].nodeType);
i != 1 ? alert(childs[i].nodeValue) : alert(childs[i].childNodes[0].nodeValue);
}
var first = element[0].firstChild;
alert(first.nodeType);
alert(first.nodeValue);
alert(first.nodeName);
var last = element[0].lastChild;
alert(last.nodeType);
alert(last.nodeValue);
alert(last.nodeName);
-->
</script>
1 則留言:
雖然不是大錯誤、不過在 lastChild 的說明部分剛開始的地方打錯了! 應該是 node.lastChild 才對! 還有這篇說的滿清楚的、感謝分享 ^_^
張貼留言