CIS 375—Web App Dev II DOM

2 Introduction to DOM The XML Document ________ Model (DOM) is a programming interface for XML documents. It defines the way an XML document can be accessed and _____________. The XML DOM is designed to be used with any programming language and any __________ system. The DOM represents a ______ view of the XML document. The documentElement is the top-level of the tree. This element has one or many ___________ that represent the branches of the tree.

3 Common Node Types Node TypeExample Document type Processing instruction Element Carlsberg Attributetype="beer“ TextCarlsberg

4 Parsing the DOM The Microsoft XML _______ is a COM component that comes with Microsoft Internet Explorer 5.0.COM The Microsoft XMLDOM parser: Supports JavaScript, VBScript, Perl, VB, Java, C++, … Supports W3C XML 1.0 and XML DOM Supports DTD and validation Creating an XML document object using JavaScript, _________, and VBScript in ASP: var xmlDoc = new ActiveXObject("Microsoft.XMLDOM") set xmlDoc = CreateObject("Microsoft.XMLDOM") set xmlDoc = Server.CreateObject("Microsoft.XMLDOM")

5 Loading XML Files and Text Loading a file var xmlDoc = new ActiveXObject("Microsoft.XMLDOM") xmlDoc.async="false" xmlDoc.load("note.xml") // processing the document goes here Loading text (see example)example var text=" “ text=text+" Tove Jani “ text=text+" Reminder “ text=text+" Don't forget me this weekend! “ text=text+" " var xmlDoc = new ActiveXObject("Microsoft.XMLDOM") xmlDoc.async="false" xmlDoc.loadXML(text) // processing the document goes here

6 Parser Errors The parseError _______ can be used to extract error information from the Microsoft XML parser, but is not a part of the W3C DOM standard. The following ___________ code accesses the parseError object: var xmlDoc = new ActiveXObject("Microsoft.XMLDOM") xmlDoc.async="false" xmlDoc.load("note_error.xml") document.write(" Error Code: ") document.write(xmlDoc.parseError.errorCode) document.write(" Error Reason: ") document.write(xmlDoc.parseError.reason) document.write(" Error Line: ") document.write(xmlDoc.parseError.line) Try it Yourself or just look at the XML file Try it Yourselflook at the XML file

7 DOM Validator To help you validate your xml, w3schools has used Microsoft's XML parser to create an xml validator. Paste your XML in the text area, and validate it by pressing the validate button. You can also validate your XML files simply by typing the URL of your XML file and pressing the submit button. NOTE: If you get an error when accessing this file, it is because your IE security settings do not allow access across domains. To correct, select Tools, Internet Options, Security, Custom Level…, Miscellaneous, Access data sources across domains

8 Accessing the DOM The following VBScript code examples traverse an XML node _____, and display the XML elements in the browser: JUST TRY IT and also try the CD catalog example JUST TRY ITCD catalog example The following JavaScript reads XML data from an XML document and writes the XML data into (waiting) ______ elements. JUST TRY IT Addressing elements by number is not the preferred way to extract XML elements. Using ______ is better. JUST TRY IT

9 The HttpRequest Object The httpRequest object is not a part of the W3C DOM __________. How to get an XML file from the server using the httpRequest object (works only in IE): Try it Yourself or Try this example Try it YourselfTry this example How to get an XML file from the server using the httpRequest object (works only in IE): Try it Yourself You can also send an XML document to an ASP page on the server, analyze the request, and send back the result. Try it Yourself (see the w3Schools page for ASP code) Try it Yourself

10 DOM NodeTypes Nodes are separated into different types. The XML file used in the examples: note_special.xmlnote_special.xml We traverse the file to get the nodeType of the nodes: NodeTypeNodeType We traverse the file to get the nodeName of the same nodes: NodeNameNodeName We traverse the file to get the nodeValue of the same nodes: NodeValueNodeValue In IE5, you can also get the nodeType as a string, with the.nodeTypeString property: NodeTypeStringNodeTypeString