XML/XSLT Tutorials
Nach obenTutorialübersicht:
Nach obenEine XML Datei mit XSL stylen
Hier soll erstmal geklärt werden, wie man eine XML Datei so styled, dass man nicht nur ein Konstrukt aus Elementen bekommt Hierzu braucht man erstmal eine XML Datei. Hier mal ein kleines Beispiel:
<?xml version="1.0" encoding="utf-8"?>
<?xml-stylesheet href="artikel1_code2.xsl" type="text/xsl"?>
<regal>
<titel>Mein Regal mit Buechern</titel>
<buch>
<autor>Karl Testautor</autor>
<verlag>WMP Verlag</verlag>
<titel>XML und XSL</titel>
<typ>Tutorial</typ>
</buch>
<buch>
<autor>Maria Testautor</autor>
<verlag>WMP Verlag</verlag>
<titel>XML mit XSL stylen</titel>
<typ>Tutorial</typ>
</buch>
</regal>
Nun haben wir schonmal die XML Datei. Wenn man diese nun im Browser aufruft bekommt man die XML Datei ausgegeben aber gut aussehen tut es nicht. Dafür erstellt man nun noch folgende XSL Datei:
<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" />
<xsl:template match="/regal">
<html>
<head>
<title><xsl:value-of select="titel" /></title>
<link rel="stylesheet" type="text/css" href="artikel1_code3.css"/>
</head>
<body>
<xsl:for-each select="buch">
<div id="Buch">
<strong>Titel:</strong> <xsl:value-of select="titel" />
<xsl:if test="typ!=''">
(<xsl:value-of select="typ" />)
</xsl:if><br />
<strong>Autor:</strong>
<xsl:if test="autor!=''">
<xsl:value-of select="autor" />
</xsl:if><br />
<strong>Verlag:</strong>
<xsl:if test="verlag!=''">
<xsl:value-of select="verlag" />
</xsl:if><br />
</div>
</xsl:for-each>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
Wenn ihr die XML Datei nun aufruft werdet ihr zwar schon eine "schönere" Ausgabe haben aber auch noch nicht die beste. Dafür könnt ihr diese CSS-Datei noch nutzen:
div {
background-color : rgb(245, 245, 245);
font-family : Verdana, Tahoma, Courier, Sans-Serif;
font-size : 11px;
color : #000000;
border: 1px solid rgb(180, 180, 180);
padding: 0.3em;
margin: 0 auto 0.5em;
width: 250px;
}
Ruft ihr nun die XML Datei solltet ihr zwei kleine "Kästen" sehen mit den Daten aus der XML Datei. Nun mal eine kleine Erklärung des angewendeten XSL-Elemente:
<xsl:template match="/regal">...</xsl:template>
Mit diesem Element definiert man in XSLT eine sogenannte Template-Rule für ausgewählte Elemente. Mit dem match-Attribut legt man fest, auf welche Elemente sich diese Template-Rule auswirken soll. In unserem Fall bekommt dieses Attribut den Wert /regal, da wir diese Template-Rule auf alles zwischen <regal> und </regal> auswirken lassen wollen.
<xsl:output method="html" />
Mit diesem Top-Level-Element (=muss nach dem <xsl:stylesheet>-Element kommen) defeniert man das Ausgabeformat. Das method-Attribut legt das Ausgabeformat fest. Man kann die Formate XML, HTML und reinen Text definieren. In unserem Fall wurde html gewählt, damit wir eine HTML-ähnliche Ausgabe haben. Würden wird XML nehmen, würden wir lediglich die Werte ausgegeben bekommen.
<xsl:for-each select="/buch">...</xsl:for-each>
Dieses Element wird für die, die sich schon mit einer Programmiersprache auskennen vielleicht bekannt vorkommen bzw. wissen wozu dieses Element genutzt werden kann. Da wir zwei gleiche Knoten haben (<buch>) brauchen wir dieses Element. Es durchläuft nacheinander die Knoten, die im select-Attribut definiert sind.
<xsl:value-of select="titel" />
Mit diesem Element lässt man einen Wert ausgaben. Mit dem select-Attribut legt man fest, aus welchem XML-Element der Wert genommen werden soll.
<xsl:if test="typ!=''">...</xsl:if>
Dieses Konstrukt stellt eine if-Anweisung dar. Im test-Attribut findet der Vergleich/Test statt. Wird die Anweisung aus dem test-Attribut erfüllt, so wird der Text o.ä., welcher zwischen dem Anfangs- und Endelement steht, angezeigt.
Goliath
Hmmm....ist mehr ein Beispiel als eine Anleitung, wie das allgemein funktioniert.
miraculix
meiner Meinung nach am Anfang etwas komisch geschrieben, ansonsten gut.
Rednix
Es fehlt die Erklärung, wie der CSS-Teil eingebunden wird.
Ansonsten wär's ok
Necrose
Also ich hab so was gesucht. Kurz und aufgeraeumt, klar und beispielhaft.
Gruesse aus Berlin
nilshero
Sehr Gut! Aber: Noch ein paar winzige Details, die ich schnell korrigiert hätte, handelte es sich hier um ein Wiki. Da entgegen eurer Behauptung 'mitmachen' nicht, macht die Arbeit mal schön selbst. Ich kann mich auch bei der Wikipedia austoben. Tschüssi.