switch(nodNode.nodeType)
{
case 3: //文本节点， 黑色 粗体显示
strNodes+=getIndent(intLevel)+"<b>"+nodNode.nodeValue+"</b><br>";break;
case 7: //指令节点 ， 调用子函数
strNodes+=renderInstruction(nodNode,intLevel); break;
case 8: //注释节点 ， 调用子节点
strNodes+=renderComment(nodNode,intLevel); break;
case 9: //Document 节点 -- “根”节点。不需要显示，只需显示子节点
//遍历节点的子节点就是这样写地 : ) ,so easy
intCount = nodNode.childNodes.length;
if (intCount > 0)
{
for (intNode = 0; intNode < intCount; intNode++)
strNodes += renderChildNodes(nodNode.childNodes(intNode), intLevel + 1);
}
break;
default://普通节点
strNodes+=getIndent(intLevel)+"<font color=\"blue\"><</font>"; // 蓝色 <
strNodes+="<font color=\"#800000\">"+nodNode.nodeName+"</font> "; // 褐色 node name
//显示 属性
nodAttrList = nodNode.attributes;//得到属性节点集(collection -- 我最喜欢的数据类型之一)先
if (nodAttrList != null) //有属性
{
intCount = nodAttrList.length; //collection 之 length ,方便吧？ ：）
if (intCount > 0)
{
for (intAttr = 0; intAttr < intCount; intAttr++)
//红色 属性名，蓝色 引号
strNodes += "<font color=\"red\">"+nodAttrList(intAttr).nodeName + '</font>=<font color=\"blue\">\"</font>' + nodAttrList(intAttr).nodeValue + '<font color=\"blue\">\"</font> ';
}
}
//处理当前节点的子节点
intCount = nodNode.childNodes.length;
if (intCount > 0)
{//如果有子节点
strNodes+="<font color=\"blue\">></font><br>" //属性显示完 ，用“ 〉“闭合 Tag先
// 对每个子节点递归调用 renderChildNodes
for (intNode = 0; intNode < intCount; intNode++)
strNodes += renderChildNodes(nodNode.childNodes(intNode), intLevel + 1);
//显示关闭标记 </NodeName>
strNodes+=getIndent(intLevel)+"<font color=\"blue\"></</font><font color=\"#800000\">"+nodNode.nodeName +"</font><font color=\"blue\">></font><br>";
}
else
strNodes += "<font color=\"blue\">/></font><br>" //没有子节点， 显示 “ /〉“
}
return strNodes;
}
//给注释节点着色
function renderComment(nodNode,intLevel)
{
var strNodes = '';
var intCount = 0;
var intNode = 0;
var nodAttrList;
strNodes+=getIndent(intLevel)+"<font color=\"gray\"><!-- ";
strNodes+= nodNode.nodeValue;
strNodes+=" --></font><br>";
return strNodes;
}
