遍歷dom文檔的所有節點
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>node.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=GBK">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
</head>
<body>
<div align="center">
<div id="head">
用戶名:<input type="text" name="uname" id="uname"/>
</div>
</div>
</body>
</html>
<script type="text/javascript">
window.onload = function(){
var rootNode = document.documentElement;
itor(rootNode);
//打印輸出
document.write(msg);
}
function itor(node){
//首先判斷是否是元素節點
if (node.nodeType == 1) {
//是元素節點，打印
display(node);
for (var i = 0; i < node.length; i++) {
var attr = node.attributes[i];
//判斷屬性節點是否存在
if (attr.specified) {
display(attr);
}
}
//判斷是否有孩子節點
if (node.hasChildNodes()) {
var sonNodes = node.childNodes;
for (var j = 0; j < sonNodes.length; j++) {
var sonNode = sonNodes[j];
//用到遞歸方法
itor(sonNode);
}
}
}else {
display(node);
}
}
var msg = "";
function display(node){
msg += "<br/>節點的名稱" + node.nodeName + "節點的值：" + node.nodeValue + "節點的類型:" + node.nodeType;
}
</script>