XML DOM
DOM (Document Object Model) defines standard methods for accessing and manipulating documents.
XML DOM
XML DOM (XML Document Object Model) defines a standard method for accessing and manipulating XML documents.
XML DOM View XML documents as a tree structure.
All elements can be accessed through the DOM tree. Their contents can be modified or deleted, and new elements created. Elements, their text, and their attributes are all considered nodes.
You can learn more about XML DOM in our XML DOM tutorial.
HTML DOM
HTML DOM defines standard methods for accessing and manipulating HTML documents.
All HTML elements can be accessed through the HTML DOM.
You can learn more about HTML DOM in our HTML DOM tutorial. .
Loading an XML file - Cross-browser example
The following example parses an XML document ("note.xml") into an XML DOM object, and then extracts some via JavaScript Information:
Instance
<html> <body> <h1>php.cn</h1> <div> <b>To:</b> <span id="to"></span><br /> <b>From:</b> <span id="from"></span><br /> <b>Message:</b> <span id="message"></span> </div> <script> if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.open("GET","note.xml",false); xmlhttp.send(); xmlDoc=xmlhttp.responseXML; document.getElementById("to").innerHTML= xmlDoc.getElementsByTagName("to")[0].childNodes[0].nodeValue; document.getElementById("from").innerHTML= xmlDoc.getElementsByTagName("from")[0].childNodes[0].nodeValue; document.getElementById("message").innerHTML= xmlDoc.getElementsByTagName("body")[0].childNodes[0].nodeValue; </script> </body> </html>
Run Instance»
Click the "Run Instance" button to view the online instance
Important note!
To extract the text "Tove" from the <to> element of the above XML file ("note.xml"), the syntax is:
Note that even if the XML file contains only one <to> element, you must still specify the array index [0]. This is because the getElementsByTagName() method returns an array.
Load an XML string - cross-browser example
The following example parses the XML string into an XML DOM object, and then extracts some information through JavaScript:
Instance
<html> <body> <h1>PHP.CN</h1> <div> <b>To:</b> <span id="to"></span><br /> <b>From:</b> <span id="from"></span><br /> <b>Message:</b> <span id="message"></span> </div> <script> txt="<note>"; txt=txt+"<to>Tove</to>"; txt=txt+"<from>Jani</from>"; txt=txt+"<heading>Reminder</heading>"; txt=txt+"<body>Don't forget me this weekend!</body>"; txt=txt+"</note>"; if (window.DOMParser) { parser=new DOMParser(); xmlDoc=parser.parseFromString(txt,"text/xml"); } else // Internet Explorer { xmlDoc=new ActiveXObject("Microsoft.XMLDOM"); xmlDoc.async=false; xmlDoc.loadXML(txt); } document.getElementById("to").innerHTML= xmlDoc.getElementsByTagName("to")[0].childNodes[0].nodeValue; document.getElementById("from").innerHTML= xmlDoc.getElementsByTagName("from")[0].childNodes[0].nodeValue; document.getElementById("message").innerHTML= xmlDoc.getElementsByTagName("body")[0].childNodes[0].nodeValue; </script> </body> </html>
Run Instance»
Click the "Run Instance" button to view the online instance