Sample 4: Parsing an XML File Using JScript

<HTML>
<HEAD>
<TITLE>JScript XML Sample</TITLE>
</HEAD>
<BR>
<H1><B><CENTER>JScript XML Sample</B></H1>
<P>This page demonstrates using XML in JScript. Enter a valid XML or CDF file in the 
text box below and it will be parsed using MSXML and JScript. CDF is based on XML.
Information about each element in the file will be displayed in another window. For more
information on CDF, see Internet Explorer 4.0 authors and developers  site.

<P>Enter an XML or CDF file name:<BR>
<INPUT TYPE=TEXT NAME="cdfURL" VALUE="" size=50><BR>

<OBJECT
    classid="clsid:CFC399AF-D876-11D0-9C10-00C04FC99C8E"
    id="MSXML"
    Name="xmlDoc">
</OBJECT>

<BR><BR>

<INPUT TYPE = "BUTTON"
    NAME = "ParseCDF"     
    VALUE = "Parse The XML/CDF File"
    onClick = "WalkXMLMain(cdfURL.value)">

</CENTER>

<SCRIPT>
var win;                                // status goes here
var doc;                                // document to write on
var knownAttrs = new Object;            // element attribute variable

//
// Display the attribute. 
//
function dumpAttrs(elem)
{
    var i, val, result = "";
  
    for (i in knownAttrs)
    {
    val = elem.getAttribute(knownAttrs[i]);
        if ((val != "") && (val != null))
            result = result + knownAttrs[i] + "=" + val + " ";
    }

    return result;
}

//
// Display the element information for each element in the file. 
//
function dumpElement(elem)
{
    var children, cChildren, child
    var i, length;

    if (elem == null)
    {
        alert("elem == null");
        window = document;              //      Force a run-time error to bail
    }

    children = elem.children;
    if (children != null)
    length = children.length;
    else
    length = 0;

// Display the element information in the table.
    doc.write("<TR><TD>" + GetTagName(elem) + "</TD>");
    doc.write("<TD>" + GetType(elem.type) + "</TD>");
    if (elem.parent != null) // skip text for root node
    doc.write("<TD>" + elem.text + "</TD>");
    else
    doc.write("<TD>" + " " + "</TD>");
    doc.write("<TD>" + dumpAttrs(elem) + "</TD>");
    doc.write("<TD>" + GetParentTag(elem) + "</TD>");        
    doc.write("<TD>" + length + "</TD></TR>");

// If the element has children, call dumpElement again
    if (children != null)
    {

        cChildren = children.length;

        for (i = 0; i < cChildren; i++)
        {
            child = children.item(i);
            dumpElement(child);
        }
    }
}

//
// Initialize the knownAttrs variable.
//
function loadKnownAttrs()
{
// Incomplete list, just for example.
    knownAttrs[0] = "HREF";
    knownAttrs[1] = "STYLE";
    knownAttrs[2] = "HOUR";
    knownAttrs[3] = "DAY";
    knownAttrs[4] = "MIN";
    knownAttrs[5] = "IsClonable";
    knownAttrs[6] = "Type";
    knownAttrs[7] = "BASE";
    knownAttrs[8] = "SELF";
}

//
// Write information to the browser status bar.
//
function setStatus(s)
{
    win.status = s;
}

//
// Main function, calls dumpElement.
//
function WalkXMLMain(cdfName)
{
    var startTime = new Date();
    var CDFFile, xmlDoc;

    win = window.open("", "XMLOutput");
    doc = win.document;

    doc.writeln("<HTML>");
    doc.writeln("<TITLE>XML Output</TITLE>");
    doc.writeln("<BODY>");
    doc.writeln("<PRE>");

    setStatus("Loading known attributes...");
    loadKnownAttrs();

    setStatus("Creating XML object...");
    xmlDoc = MSXML;

    setStatus("Loading XML document...");
    xmlDoc.URL = cdfName;
    setStatus("File has been assigned to xmlDoc.URL");

// Show the document information.
    ShowDocInfo(xmlDoc);

// Initialize the table for the element information.
    MakeNodeHeader(win);

// Traverse the XML tree showing the element information.
    dumpElement(xmlDoc.root);

    doc.writeln("</TABLE>");
    var stopTime = new Date();
    doc.writeln("<FONT SIZE=&quot+1&quot><P>Start: " + startTime + "   Stop: " + stopTime + "</FONT>");
    doc.writeln("</PRE>");
    doc.writeln("</BODY>");
    doc.writeln("</HTML>");
    
    xmlDoc = null;
    setStatus("Done!");
}

//
// Initialize the table for the element information.
//
function MakeNodeHeader(win)
{
    doc.writeln("<BR><BR><H2>Element Information</H2></CENTER>");
    doc.write("<FONT SIZE=&quot+1&quot><P>The properties of each node in the XML file is listed in the following table.<BR><BR></FONT>");

    doc.write("<TABLE BORDER CELLSPACING=2 CELLPADDING=2>");
    doc.write("<TR><TD ALIGN=LEFT><B>Tag Name</B></TD>");
    doc.write("<TD ALIGN=LEFT><B>Type</B></TD>");
    doc.write("<TD ALIGN=LEFT><B>Text (if any)</B></TD>");
    doc.write("<TD ALIGN=LEFT><B>Attribute</B></TD>");
    doc.write("<TD ALIGN=LEFT><B>Parent</B></TD>");
    doc.write("<TD ALIGN=LEFT><B># of Children</B></TD></TR>");
}

//
// Return the element type. 
//
function GetType(type)
{

  if (type == 0)
    return "ELEMENT";

  if (type == 1)
    return "TEXT";

  if (type == 2)
    return "COMMENT";

  if (type == 3)
    return "DOCUMENT";

  if (type == 4)
    return "DTD";
  else
    return "OTHER";
}

//
// Return the tag name.
//
function GetTagName(elem)
{
  if (elem.type == 0)
    return elem.tagName;
  else
    return " ";
}

//
// Return the parent tag name.
//
function GetParentTag(elem)
{
  if (elem.parent != null)
    return GetTagName(elem.parent);
  else
    return " ";
}

//
// Display document information about the XML file.
//
function ShowDocInfo(xmlDoc)
{
  doc.writeln("<FONT FACE=&quottimes&quot SIZE=&quot+1&quot><CENTER><H2>Document Information</H2>");
  if (xmlDoc.URL != null)
    doc.writeln("<P>URL is: " + xmlDoc.URL);
  doc.writeln("<P>Version is: " + xmlDoc.version);
  if (xmlDoc.doctype != null)
    doc.writeln("<P>Doc Type is: " + xmlDoc.doctype);
  if (xmlDoc.readyState != null)
    doc.writeln("<P>Ready State is: " + GetReadyState(xmlDoc.readyState));
  if (xmlDoc.charset != null)
    doc.writeln("<P>Character Set is: " + xmlDoc.charset);
}

//
// Return the ready state of the document.
//
function GetReadyState(state)
{
  if (state == 0)
    return "READYSTATE_UNINTIALIZED";
  if (state == 1)
    return "READYSTATE_LOADING";
  if (state == 2)
    return "READYSTATE_LOADED";
  if (state == 3)
    return "READYSTATE_INTERACTIVE";
  if (state == 4)
    return "READYSTATE_COMPLETE";
  else
    return "undefined";
}

</SCRIPT>
</BODY>
</HTML>