XML-Anwendung

XML-Anwendung

In diesem Kapitel werden einige kleine XML-Anwendungen vorgestellt, die auf XML, HTML, XML DOM und JavaScript basieren.

Beispiel für ein XML-Dokument

In dieser Anwendung verwenden wir die Datei „cd_catalog.xml“.

Erste CD im HTML-div-Element anzeigen

Das folgende Beispiel ruft die XML-Daten vom ersten CD-Element ab und zeigt die Daten dann im HTML-Element mit id="showCD" an. Die Funktion displayCD() wird aufgerufen, wenn die Seite geladen wird:

Beispiel

 x=xmlDoc.getElementsByTagName("CD");
ich=0;

Funktion displayCD()
{
artist=(x[i].getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue);
title=(x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue);
year=(x[i].getElementsByTagName("YEAR")[0].childNodes[0].nodeValue);
txt="Künstler: " + Künstler + "<br />Titel: " + Titel + "<br />Jahr: "+ Jahr;
document.getElementById("showCD").innerHTML=txt;
}

Probieren Sie es aus »

Navigationsskript hinzufügen

Um dem obigen Beispiel Navigation (Funktionalität) hinzuzufügen, müssen zwei Funktionen erstellt werden: next() und previous():

Beispiel

 Funktion next()
{ // Zeigt die nächste CD an, es sei denn, Sie befinden sich auf der letzten CD
if (i<x.length-1)
{
i++;
displayCD();
}
}

Funktion previous()
{ // Zeigt die vorherige CD an, es sei denn, Sie befinden sich auf der ersten CD
wenn (i>0)
{
ich--;
displayCD();
}
}

Probieren Sie es aus »

Albuminformationen anzeigen, wenn Sie auf die CD klicken

Das letzte Beispiel zeigt, wie Albuminformationen angezeigt werden, wenn der Benutzer auf ein CD-Element klickt:

Probieren Sie es aus.

Um mehr über die Verwendung von JavaScript und dem XML-DOM zu erfahren, besuchen Sie unser XML-DOM-Tutorial.