使用 js 处理XML 文档

index.html
==========================================================
<html>
<script language="JavaScript" src="getXML.js"></script>
<script language="JavaScript" type="text/javascript">
    //-------开始调用------------------------------------------------------
    var DOMRoot = getXML("Login.xml");

    //输出目录树结构
    switchTree(DOMRoot, 2);
</script>
</html>

getXML.js
==========================================================
function createXMLDom(){
    if (window.ActiveXObject)
        var xmldoc = new ActiveXObject("Microsoft.XMLDOM");
    else
        if (document.implementation && document.implementation.createDocument)
            var xmldoc = document.implementation.createDocument("", "doc", null);
    xmldoc.async = false;
    //为了和FireFox一至，这里不能改为False;
    xmldoc.preserveWhiteSpace = true;
    return xmldoc;
}

function createXMLHttp(){
    var xmlHttp;
    if (window.ActiveXObject) {
        xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    else {
        xmlHttp = new XMLHttpRequest();
    }
    return xmlHttp;
}

//加载XML文件。
function getXML(xmlFile){
    var xmlDom = createXMLDom();
    try {
        xmlDom.load(xmlFile);
    }
    catch (e) {
        var xmlHttp = createXMLHttp();
        xmlHttp.onreadystatechange = function(){
            if (xmlHttp.readyState == 4) {
                xmlDom = xmlHttp.responseXML;
            }
            else {
                window.state = "XML文件加载中...";
            }
        }
        xmlHttp.open("GET", xmlFile, false);
        xmlHttp.send(null);
    }
    return xmlDom.documentElement;
}

//取出指定节点的属性。
function getDOMAtt(pNode, pAttribute){
    try {
        return pNode.attributes.getNamedItem(pAttribute).nodeValue;
    }
    catch (e) {
        //alert("指定节点不存在，或指定属性："+pAttribute+" 不存在!")
        return false;
    }

}

//获取当前节点的属性列表
function attList(pNode){
    if (pNode.nodeType == 4)
        return '';
    var oAtt, tmpString = "[ ";
    try {
        for (var i = 0; oAtt = pNode.attributes[i]; i++) {
            tmpString += oAtt.nodeName + " = '" + oAtt.nodeValue + "' ";
        }
        tmpString += " ]"
        return tmpString;
    }
    catch (e) {
        return ''
    }
}

//获取节点名称
function getNodeName(pNode){
    if (pNode.nodeType == 4)
        return '';
    return pNode.nodeName;
}
//获取节点名称
function getNodeValue(pNode){
    try {
        return " : " + pNode.firstChild.nodeValue;
    }
    catch (e) {
        return ''
    }
}

//＜----------------------------调试功能函数------------------------------>
//输出空格
function nbsp(pNum){
    var tmpString = ""
    for (var i = 0; i < pNum; i++) {
        tmpString += "　"//这里是全角的空格
    }
    return tmpString;
}

//用于高度输出完整的XML树
function switchTree( pNode, pLevel ){
    var tNode, i;
    for (i = 0; tNode = pNode.childNodes[i]; i++) {
        if (tNode.nodeType == 3)
            continue;//因为preserveWhiteSpace等于true
        document.write(nbsp(pLevel),"<font color='blue'><b>",getNodeName(tNode),"</b></font><font color='red'>",attList(tNode),"</font>",getNodeValue(tNode),"<br />");

        switchTree(tNode, pLevel + 1);
    }
}

Login.xml
==========================================================

<?xml version="1.0" encoding="utf-8" ?>
<Login>
    <Character>
        <C Text="热血" Value="0"></C>
        <C Text="弱气" Value="1"></C>
        <C Text="激情" Value="2"></C>
        <C Text="冷静" Value="3"></C>
        <C Text="冷酷" Value="4"></C>
    </Character>
    <Weapon>
        <W Text="光束剑" X="XXXX 其他参数" Value="0"></W>
        <W Text="光束配刀" Value="1"></W>
    </Weapon>
    <EconomyProperty>
        <P Text="平均型" Value="0"></P>
        <P Text="重视攻击" Value="1"></P>
        <P Text="重视敏捷" Value="2"></P>
        <P Text="重视防御" Value="3"></P>
        <P Text="重视命中" Value="4"></P>
    </EconomyProperty>
</Login>