Παράδειγμα 2

Στο παρακάτω παράδειγμα η κλήση στον σέρβερ γίνεται όταν φορτώσει το έγγραφο.

Επίσης, στο παράδειγμα αυτό η ajax καλεί από τον σερβερ ένα xml έγγραφο και συγκεκριμένα το products.xml.

<script>
	window.addEventListener('load', loadXMLDoc);
	function loadXMLDoc()
	{
		var xmlhttp=new XMLHttpRequest();
		xmlhttp.onreadystatechange=function()
		{
			if (xmlhttp.readyState==4 && xmlhttp.status==200)
			{
				var xmldoc=xmlhttp.responseXML;
				var name=xmldoc.getElementsByTagName("name")[0].firstChild.nodeValue;
				var price=xmldoc.getElementsByTagName("price")[0].firstChild.nodeValue;
				document.getElementById('name').innerHTML=name;
				document.getElementById('price').innerHTML=price;
			}
		}
		xmlhttp.open("GET","products.xml");
		xmlhttp.send();
	}
</script>
<style>
	div span
	{
		padding:4px;
		background-color:#6FF;
	}
</style>

<body>
	<div><span id="name"></span> <span id="price"></span></div>
</body>
	Samsung 245

Επεξηγήσεις

  1. Τα δεδομένα είναι στο αρχείο products.xml.
  2. Χρησιμοποιούμε τη responseXML για να διαβάσουμε το xml αρχεία αντί της responseText.
  3. Επειδή το αντικείμενο που διαβάζουμε είναι ένα XML object, το διαχειριζόμαστε ως τέτοιο χρησιμοποιώντας τις DOM συναρτήσεις.