05. AJAX XML File

AJAX XML Παράδειγμα


Το AJAX μπορεί να χρησιμοποιηθεί για διαδραστική επικοινωνία με ένα αρχείο XML.


AJAX XML Παράδειγμα

Το παρακάτω παράδειγμα θα δείξει πώς μια ιστοσελίδα μπορεί να αντλήσει πληροφορίες από ένα αρχείο XML με το AJAX:

Παράδειγμα



Δοκιμάστε το »


Επεξήγηση παραδείγματος

Όταν ένας χρήστης κάνει κλικ πάνω στο κουμπί “Get my CD collection”, η συνάρτηση loadDoc() εκτελείται.

Η συνάρτηση loadDoc() δημιουργεί ένα αντικείμενο XMLHttpRequest, προσθέτει τη συνάρτηση που πρέπει να εκτελεστεί όταν η απάντηση του διακομιστή είναι έτοιμη και αποστέλλει την αίτηση στο διακομιστή.

Όταν η απάντηση του διακομιστή είναι έτοιμη, δημιουργείται ένας πίνακας HTML, εξάγονται κόμβοι (στοιχεία) από το αρχείο XML και τελικά ενημερώνει το στοιχείο “demo” με τον πίνακα HTML γεμάτο με δεδομένα XML:

function loadDoc() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
    myFunction(this);
    }
  };
  xhttp.open("GET", "cd_catalog.xml", true);
  xhttp.send();
}
function myFunction(xml) {
  var i;
  var xmlDoc = xml.responseXML;
  var table="<tr><th>Artist</th><th>Title</th></tr>";
  var x = xmlDoc.getElementsByTagName("CD");
  for (i = 0; i <x.length; i++) {
    table += "<tr><td>" +
    x[i].getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue +
    "</td><td>" +
    x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue +
    "</td></tr>";
  }
  document.getElementById("demo").innerHTML = table;
}

Το αρχείο XML

Το αρχείο XML που χρησιμοποιείται στο παραπάνω παράδειγμα μοιάζει με αυτό: ” cd_catalog.xml “.

Days
Hours
Minutes

05. AJAX XML File

Κοινοποίηση

Share on facebook
Share on twitter

Ακολουθήστε μας

Αρέσει σε %d bloggers: