AJAX kann zur interaktiven Kommunikation mit XML-Dateien verwendet werden.
Das folgende Beispiel zeigt, wie eine Webseite Informationen aus einer XML-Datei über AJAX liest:
Wenn der Benutzer in der Dropdown-Liste oben eine CD auswählt, wird eine Funktion namens „showCD()“ ausgeführt. Diese Funktion wird durch das Ereignis „onchange“ ausgelöst:
<html><head><script>function showCD(str){ if (str=="") { document.getElementById("txtHint").innerHTML="" } if (window.XMLHttpRequest) { // IE7+, Firefox, Chrome, Opera, Safari-Browser führen xmlhttp=new XMLHttpRequest(); else { // IE6, IE5 aus Der Browser führt xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("txtHint") aus. innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","getcd.php?q="+str,true); xmlhttp.send();}</script></head><body><form>Wählen Sie eine CD aus:<Name auswählen ="cds" onchange="showCD(this.value)"><option value="">Wählen Sie eine CD aus:</option><option value="Bob Dylan">Bob Dylan</option><option value=" Bonnie Tyler">Bonnie Tyler</option><option value="Dolly Parton">Dolly Parton</option></select></form><div id="txtHint"><b>CD-Informationen werden hier aufgelistet...</ b></div></body></html>
Die Funktion showCD() führt die folgenden Schritte aus:
Überprüfen Sie, ob eine CD ausgewählt ist
Erstellen Sie ein XMLHttpRequest-Objekt
Erstellen Sie eine Funktion, die ausgeführt wird, wenn die Serverantwort bereit ist
Senden Sie eine Anfrage an eine Datei auf dem Server
Bitte beachten Sie den am Ende der URL hinzugefügten Parameter (q) (der den Inhalt der Dropdown-Liste enthält).
Die oben über JavaScript aufgerufene Serverseite ist eine PHP-Datei mit dem Namen „getcd.php“.
Das PHP-Skript lädt das XML-Dokument „cd_catalog.xml“, führt die Abfrage für die XML-Datei aus und gibt die Ergebnisse in HTML zurück:
<?php$q=$_GET["q"];$xmlDoc = new DOMDocument();$xmlDoc->load("cd_catalog.xml");$x=$xmlDoc->getElementsByTagName('ARTIST');for ($i=0; $i<=$x->length-1; $i++){ // Prozesselementknoten if ($x->item($i)->nodeType==1) { if ($x->item($i)->childNodes->item(0)->nodeValue == $q) { $y= ($x->item($i)->parentNode); } }}$cd=($y->childNodes);for ($i=0;$i<$cd->length;$i++){ // Elementknoten verarbeiten if ($cd->item($i)->nodeType==1) { echo("<b>" . $cd->item($i)->nodeName . ":</b > "); echo($cd->item($i)->childNodes->item(0)->nodeValue); echo("<br>"); }}?>
Was passiert, wenn die CD-Abfrage von JavaScript an die PHP-Seite gesendet wird:
PHP erstellt ein XML-DOM-Objekt
Suchen Sie in allen <artist>-Elementen nach Namen, die mit den von JavaScript übergebenen Daten übereinstimmen
Geben Sie die Albuminformationen aus und senden Sie den Platzhalter „txtHint“ zurück