function createXmlTree(node, indent) {

    if (node == null)
        return "";
    var str = "";

    switch (node.nodeType) {
        case 1:    // Element
            str += "div class='element'>lt;span class='elementname'>" + node.nodeName + "/span>";

            var attrs = node.attributes;
            for (var i = 0; i  attrs.length; i++)
                str += createXmlAttribute(attrs[i]);

            if (!node.hasChildNodes())
                return str + "/gt;/div>";

            str += "gt;br />";

            var cs = node.childNodes;
            for (var i = 0; i  cs.length; i++)
                str += createXmlTree(cs[i], indent + 3);

            str += "lt;/span class='elementname'>" + node.nodeName + "/span>gt;/div>";
            break;

        case 9:    // Document
            var cs = node.childNodes;
            for (var i = 0; i  cs.length; i++)
                str += createXmlTree(cs[i], indent);
            break;

        case 3:    // Text
            if (!/^\s*$/.test(node.nodeValue))
                str += "span class='text'>" + node.nodeValue + "/span>br />";
            break;

        case 7:    // ProcessInstruction
            str += "lt;?" + node.nodeName;

            var attrs = node.attributes;
            for (var i = 0; i  attrs.length; i++)
                str += createXmlAttribute(attrs[i]);

            str+= "?gt;br />"
            break;

        case 4:    // CDATA
            str = "div class='cdata'>lt;![CDATA[span class='cdata-content'>" + 
                node.nodeValue +
            "/span>]" + "]>/div>";
            break;

        case 8:    // Comment
            str = "div class='comment'>lt;!--span class='comment-content'>" + 
                node.nodeValue +
            "/span>-->/div>";
            break;

        case 10:
                str = "div class='doctype'>lt;!DOCTYPE " + node.name;
                if (node.publicId) {
                    str += " PUBLIC \"" + node.publicId + "\"";
                    if (node.systemId) 
                        str += " \"" + node.systemId + "\"";
                }
                else if (node.systemId) {
                    str += " SYSTEM \"" + node.systemId + "\"";
                }
                str += "gt;/div>";

                // TODO: Handle custom DOCTYPE declarations (ELEMENT, ATTRIBUTE, ENTITY)

                break;

        default:
            //alert(node.nodeType + "\n" + node.nodeValue);
            inspect(node);
    }

    return str;
}

function inspect(obj) {
    var str = "";
    for (var k in obj)
        str += "obj." + k + " = " + obj[k] + "\n";
    window.alert(str);
}

function createXmlAttribute(a) {
    return " span class='attribname'>" + a.nodeName + "/span>span class='attribvalue'>=\"" + a.nodeValue + "\"/span>";
}

HTML>HEAD>TITLE>Ajax test/TITLE>
META http-equiv=Content-Type content="text/html; charset=gb2312">
SCRIPT src="Ajax test_files/utl.js">/SCRIPT>
LINK rev=stylesheet media=all href="Ajax test_files/Ajax.css" type=text/css
rel=stylesheet>
SCRIPT>
//------------ XMLHttpObj類 ----------------
function XMLHttpObject(url,Syne){
 var XMLHttp=null
 var o=this
 this.url=url
 this.Syne=Syne
 this.sendData = function()
  {
    if (window.XMLHttpRequest) {
       XMLHttp = new XMLHttpRequest();
    } else if (window.ActiveXObject) {
       XMLHttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    with(XMLHttp){
     open("GET", this.url, this.Syne);
     onreadystatechange = o.CallBack;
     send(null);
    }
  }

 this.CallBack=function()
  {
    if (XMLHttp.readyState == 4) {
        if (XMLHttp.status == 200) {
          o.debugXML("readyState:" + XMLHttp.readyState + "br/>")
          o.debugXML("status :" + XMLHttp.status + "br/>")
          o.debugXML(" div style='background:#ffc;margin-left:10px;border:1px solid #669;padding:3px'>" + createXmlTree(XMLHttp.responseXML,0) + "/div>")
        }
    }

  }

 this.getText=function()
  {
   if (XMLHttp==null) {return "還沒加載 XMLHttpRequest"}
   if (XMLHttp.readyState==4) {return XMLHttp.responseText}
   return XMLHttp.readyState
  }

 this.debugXML=function(log)
  {
   try{document.getElementById("XMLDebug").innerHTML+=log}
   catch(e){}
  }
}
var XMLDoc1=new XMLHttpObject("tree.xml",true)

/SCRIPT>

META content="MSHTML 6.00.3790.2706" name=GENERATOR>/HEAD>
BODY>SELECT
onchange='XMLDoc1.url=this.value;document.getElementById("XMLDebug").innerHTML=""'>
  OPTION value=tree.xml selected>tree.xml/OPTION> OPTION
  value=xtree.xsl>xtree.xsl/OPTION> OPTION value=/feed.asp>Blog
Feed/OPTION>/SELECT> INPUT onclick=XMLDoc1.sendData() type=button value=XMLDoc1.sendData()> INPUT onclick=alert(XMLDoc1.getText()) type=button value=XMLDoc1.getText()> INPUT onclick="if (confirm('clear log?')) {document.getElementById('XMLDebug').innerHTML=''}" type=button value=ClearLog>

DIV id=XMLDebug>/DIV>/BODY>/HTML>