JavaScript - Schritt für Schritt

335

Teil D

AJAX und serverseitige

Integration

In diesem Teil:

Kapitel 17 JavaScript und XML 337

Kapitel 18 JavaScript-Anwendungen 347

Kapitel 19 AJAX für Einsteiger 351

Kapitel 20 AJAX für Fortgeschrittene 371

337

Kapitel 17

JavaScript und XML

In diesem Kapitel:

XML mit JavaScript verwenden 338

Mit XML-Daten von Excel 2007 aus arbeiten 344

Ausblick 345

Übungen 345

338

Kapitel 17: JavaScript und XML

Nachdem Sie dieses Kapitel gelesen haben, sind Sie in der Lage:



die Funktionen anzuwenden, mit denen sich ein XML-Dokument per JavaScript öffnen lässt



ein XML-Dokument als HTML-Tabelle anzuzeigen



eine XML-Tabelle von Microsoft Office Excel 2007 per JavaScript anzuzeigen

XML mit JavaScript verwenden

Die Sprache XML besteht nahezu vollständig aus benutzerdefinierten Tags. Da XML wegen der benutzer-

definierten Tags äußerst anpassungsfähig ist, wird diese Sprache häufig als Dateiformat für den Datenaus-

tausch herangezogen. Für den JavaScript-Programmierer ist wichtig zu wissen, dass das X im Akronym

AJAX für XML steht. AJAX (Asynchronous JavaScript and XML) hat sich als Verfahren etabliert, um inter-

aktive Webanwendungen zu erstellen. Mehr über AJAX erfahren Sie in den Kapiteln 19 und 20.

XML ist ein offener Standard, der vom W3C (World Wide Web Consortium) definiert wurde und derzeit in

seiner fünften Ausgabe vorliegt. Dieser Abschnitt beschäftigt sich kurz mit XML soweit es JavaScript betrifft.

Weiterführende Informationen über XML finden Sie auf der Website der XML-Arbeitsgruppe unter

http://www.w3.org/XML/Core/ oder auf der Microsoft-Website unter http://msdn.microsoft.com/xml/.

Beispiel für ein XML-Dokument

XML-Dokumente bestehen aus Elementen in einer Dokumentstruktur. Diese Elemente besitzen eigene Syn-

taxregeln – unter anderem benötigen sie ein Start-Tag und ein Ende-Tag. Dem Webprogrammierer dürfte das

Aussehen eines Dokuments (das im Text zwischen Tags definiert ist) vertraut sein. Der folgende Code zeigt ein

Beispiel für ein XML-Dokument, das Sie auch als Begleitdatei books.xml im Ordner für Kapitel 17 finden:

<books>

<book>

<title>MySQL Bible</title>

<author>Steve Suehring</author>

<isbn>9780764549328</isbn>

<publisher>Wiley Publishing Inc.</publisher>

</book>

<book>

<title>JavaScript Step by Step</title>

<author>Steve Suehring</author>

<isbn>9780735624498</isbn>

<publisher>Microsoft Press</publisher>

</book>

</books>

Die Struktur des Dokuments als Ganzes muss bestimmte Kriterien erfüllen, um als wohlgeformtes Dokument

zu gelten. Wie das Beispiel zeigt, verfügt jedes Element über sein eigenes Start-Tag gefolgt von einem korres-

pondierenden Ende-Tag. Elemente können auch ineinander verschachtelt sein. Viele dieser Regeln ähneln den

HTML-Regeln. XML-Dokumente können auch Attribute enthalten. Der folgende Code ist demnach gültig:

<?xml version="1.0"?>

<book title="JavaScript Step by Step" author="Steve Suehring" isbn="9780735624498"

publisher="Microsoft Press" />

XML mit JavaScript verwenden

339

Ein XML-Dokument mit JavaScript laden

XML-Dokumente lassen sich per JavaScript laden und verarbeiten. Dieser Abschnitt zeigt, wie Sie das

bewerkstelligen.

Das Dokument importieren

Ein XML-Dokument können Sie nach zwei Verfahren importieren, abhängig davon, welche Browser Sie

unterstützen. Für neuere Browser wie Chrome, Firefox und jüngere Versionen von Windows Internet

Explorer verwenden Sie das XMLHTTPRequest-Objekt, während ältere Versionen von Internet Explorer das

ActiveXObject-Objekt verwenden. Der folgende Code lädt das Dokument books.xml in browserübergreifen-

der Art und Weise:

if (window.XMLHttpRequest) {

var httpObj = new XMLHttpRequest();

} else {

var httpObj = new ActiveXObject("Microsoft.XMLHTTP");

}

httpObj.open("GET","books.xml",false);

httpObj.send();

var xmlDocument = httpObj.responseXML;

Das Dokument anzeigen

Oftmals sind XML-Daten visuell am besten in einer Tabelle darzustellen. Abbildung 17.1 zeigt die Datei

books.xml in Excel 2007.

Abbildung 17.1 Eine XML-Datei, die in einer Excel-Tabelle dargestellt wird

Eine HTML-Tabelle ist hilfreich, um dieselben Daten wie in Abbildung 17.1 in einem Browser darzustellen.

Größtenteils setzt die Anzeige von XML-Daten per JavaScript Kenntnisse des Document Object Model

(DOM) voraus, doch keine weiteren besonderen Funktionen oder Methoden außer denen, die Sie bereits

kennengelernt haben, um das Dokument an sich zu laden.

Das nächste Beispiel erzeugt eine Funktion displayDa ta(), die Informationen in Tabellenform anzeigt.