Week 4:   Starting example   •   Lession 4.1 a   •   Lession 4.1 b   •   Lession 4.3   •   Playing around

Starting example

This is an example for a well-formed XML file. Press a key to see the properties and methods of node and responseXML.



<?xml version="1.0" encoding="UTF-8" ?>
<ajax>
 <clientseite>
  <technologie name="(X)HTML" />
  <technologie name="JavaScript" />
  <technologie name="DHTML" />
  <technologie name="Style Sheets" />
  <technologie name="XML" />
 </clientseite>
 <serverseite>
  <programmierung>Keine explizite Festlegung</programmierung>
  <sonstiges>Datenbanken, etc.</sonstiges>
 </serverseite>
</ajax>

Now, please press a key!




Works in: FF 1.5 (Win), Opera 9.00 (Win)
Note: for Opera you have to delete the prologue!
Does not work in: IE 6

HTML:

<span id="antwort"></span>

JavaScript:

window.onkeypress = sndReq;

var resObjekt = null;
function erzXMLHttpRequestObject(){
 var resObjekt = null;
 try{
  resObjekt = new ActiveXObject("Microsoft.XMLHTTP");
 }
 catch(Error){
  try{
   resObjekt = new ActiveXObject("MSXML2.XMLHTTP");
  }
  catch(Error){
   try{
    resObjekt = new XMLHttpRequest();
   }
   catch(Error){
    alert("Erzeugung des XMLHttpRequest-Objekts ist nicht möglich");
   }
  }
 }
return resObjekt;
}

function sndReq(){
 resObjekt.open('get','xml/first.xml',true);
 resObjekt.onreadystatechange = handleResponse;
 resObjekt.send(null);
}

function handleResponse(){
 xmlDok = resObjekt.responseXML;
 text = "<table border='1'><tr><th>XPath</th><th>Wert</th></tr>";
 if(resObjekt.readyState == 4){
  text += "<tr><td>xmlDok.nodeType</td><td>" + xmlDok.nodeType + "</td></tr>";
  text += "<tr><td>xmlDok.nodeName</td><td>" + xmlDok.nodeName + "</td></tr>";
  text += "<tr><td>xmlDok.hasChildNodes()</td><td>" + xmlDok.hasChildNodes() + "</td></tr>";
  text += "<tr><td>xmlDok.childNodes.length</td><td>" + xmlDok.childNodes.length + "</td></tr>";
  text += "<tr><td>xmlDok.firstChild.nodeType</td><td>" + xmlDok.firstChild.nodeType + "</td></tr>";
  text += "<tr><td>xmlDok.firstChild.nodeName</td><td>" + xmlDok.firstChild.nodeName + "</td></tr>";
  text += "<tr><td>xmlDok.firstChild.hasChildNodes()</td><td>" + xmlDok.firstChild.hasChildNodes() + "</td></tr>";
  text += "<tr><td>xmlDok.firstChild.childNodes.length</td><td>" + xmlDok.firstChild.childNodes.length + "</td></tr>";
  for(i = 0; i < xmlDok.firstChild.childNodes.length; i++){
   text += "<tr><td>xmlDok.firstChild.childNodes["+i+"].nodeType</td><td>" + xmlDok.firstChild.childNodes[i].nodeType + "</td></tr>";
   text += "<tr><td>xmlDok.firstChild.childNodes["+i+"].nodeName</td><td>" + xmlDok.firstChild.childNodes[i].nodeName + "</td></tr>";
  }
  text += "</table>";
  document.getElementById("antwort").innerHTML = text;
 }
}
resObjekt=erzXMLHttpRequestObject();