Das Document Object Model (DOM) ist die Grundlage von XML. XML-Dokumente haben eine Hierarchie von Informationseinheiten genannt Knoten; DOM ist ein Möglichkeit, diese Knoten und die Beziehungen zwischen ihnen zu beschreiben.
Ein DOM Dokument ist eine Sammlung von Knoten oder Informationsteile in einer Hierarchie organisiert. Diese Hierarchie ermöglicht dem Entwickler eine durch den Baum auf der Suche nach bestimmten Informationen zu navigieren. Weil es auf einer Hierarchie von Informationen basiert, wird der DOM gesagt werden Baum basierend.
Die XML-DOM, auf der anderen Seite, bietet auch eine API, die ermöglicht ein Entwickler hinzufügen, bearbeiten, verschieben oder Knoten in der Baum entfernen an jedem Punkt, um eine Anwendung zu erstellen.
Das folgende Beispiel (sample.htm) analysiert ein XML-Dokument ("address.xml") in ein XML-DOM-Objekt und extrahiert dann einige Informationen aus es mit JavaScript:
<!DOCTYPE html> <html> <body> <h1>Howcodex DOM example </h1> <div> <b>Name:</b> <span id="name"></span><br> <b>Company:</b> <span id="company"></span><br> <b>Phone:</b> <span id="phone"></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","/xml/address.xml",false); xmlhttp.send(); xmlDoc=xmlhttp.responseXML; document.getElementById("name").innerHTML= xmlDoc.getElementsByTagName("name")[0].childNodes[0].nodeValue; document.getElementById("company").innerHTML= xmlDoc.getElementsByTagName("company")[0].childNodes[0].nodeValue; document.getElementById("phone").innerHTML= xmlDoc.getElementsByTagName("phone")[0].childNodes[0].nodeValue; </script> </body> </html>
Inhalt der address.xml sind wie folgt:
<?xml version="1.0"?> <contact-info> <name>Tanmay Patil</name> <company>Howcodex</company> <phone>(011) 123-4567</phone> </contact-info>
Nun lasst uns diese beiden Dateien zu halten sample.htm und address.xml im gleichen Verzeichnis /xml und führen Sie die sample.htm file by opening it in any browser. This should produce an output as shown below:
Hier können Sie sehen, wie jeder der untergeordneten Knoten extrahiert wird, um ihre Werte Anzeige.