Webseite in XML Kurzeinführung

Transcrição

Webseite in XML Kurzeinführung
Webseite in XML
Kurzeinführung
1. Entwicklung ............................................................................................................ 1
2. Erste Webpage in XML ........................................................................................... 2
2.1 Erstes Beispiel .................................................................................................. 2
2.2 Tags definieren ................................................................................................. 4
2.3 Kommentare in XML ......................................................................................... 5
2.4 XML mittels CSS im Browser ansehen ............................................................. 5
2.5 HTML-Tags in XML eingesetzt .......................................................................... 6
2.6 Interne und externe DTD................................................................................... 7
2.7 Eigene Attribute definieren ................................................................................ 7
3. XML mit XSL........................................................................................................... 8
4. Weitere Adressen und Hilfen zu XML ................................................................... 10
1. Entwicklung
Aus einem IBM-Projekt entstand die Sprache GML (Generalized Markup Language).
Im Jahre 1985 wurde daraus die Sprache SGML (Standard GML) entwickelt. Diese
Sprache wurde von ISO standardisiert.
Am Forschungsinstitut CERN entwickelte Tim Berners Lee eine Sprache für
Hypertext Dokumente (HTML). Im Jahr 1993 wurde die Version HTML 1.0
spezifiziert. Im Jahr 1995 war man bei HTML Version 3.0 angelangt. Damals führte
man die bekannten Frames ein und schliesslich im Jahr 1998 wurde HTML 4.0 zum
neuen Standard.
1996 begann das W3-Konsortium an der Extensible Markup Language (XML) zu
arbeiten. Als im Herbst 1997 der Internet-Explorer 4 herauskam, unterstützte dieser
bereits XML-Ansätze. Anfang 1998 wurde XML zum offiziellen Standard des W3Konsortiums erhoben. Der "Chefentwickler" von XML ist der Kanadier Tim Bray.
Es dauerte nochmals ungefähr ein Jahr (1999), bis mit dem Internet-Explorer 5 der
erste Web-Browser herauskam, der das standardisierte XML unterstützte.
Mit XML beginnt eine neue Form von "Web-Sprachen". XML eröffnet die Basis für
weitere Sprachen, die mit XML erstellt werden. Der Schlüssel dazu ist die Fähigkeit
von XML, eigene Tags und Attribute definieren und nutzen zu können. Dadurch kann
das statische HTML erweitert oder übertroffen werden.
„XML“ Webseite
1
September 2012
2. Erste Webpage in XML
2.1 Erstes Beispiel
Das erste Beispiel ist immer sehr einfach. Sie schreiben Ihren ersten eigenen Tag!
Der Quellcode:
<?xml version="1.0"?>
<AUSGABE>Hallo World!</AUSGABE>
Dieses einfache Beispiel zeigt das Grundgerüst jeder XML-Seite. Hier haben wir
einen eigenen Tag <AUSGABE> verwendet.
Jede XML-Seite wird mit dem <?xml>-Tag begonnen. Dies ist ähnlich wie bei HTML,
wo jede Seite durch das Tag <HTML> eingeleitet wird. Jeder XML-Tag steht wie
jeder HTML Tag in spitzen Klammern.
Das <?xml>-Tag weicht jedoch in einigen entscheidenden Punkten von <HTML>-Tag
ab:
-
Der Tag muss in Kleinbuchstaben geschrieben werden.
Das Tag wird durch ein Fragezeichen eingeleitet und durch ein Fragezeichen
abgeschlossen.
Das Attribut version="1.0" legt die Version des XML-Codes fest.
Das Ende einer XML-Seite wird nicht durch einen End-Tag abgeschlossen. Bei
HTML-Seiten wird am Schluss das </HTML>-Tag eingesetzt, das es in XML nicht
gibt.
In Ihrem Code haben Sie den Tag <AUSGABE> selbst definiert. Genau wie in HTML
braucht es nach dem folgenden Text eine Schluss-Tag </AUSGABE>.
Doch auch hier unterscheidet sich XML von HTML:
-
Zu jedem Tag gibt es einen Abschluss-Tag. Einzige Ausnahme bildet das
<?xml>-Tag. In HTML gibt es einige Tags ohne Abschluss (<IMG> <HR>...).
Sie müssen unbedingt auf die Gross- und Kleinschreibung achten. Der
Schlusstag muss in obigem Fall </AUSGABE> heissen und nicht </Ausgabe>.
HTML würde diese Unterschiede akzeptieren.
Speichern Sie Ihre erste XML-Seite unter dem Namen "beispiel.xml". Achten Sie auf
die richtige Endung des Dateinamens. Laden Sie nun Ihre XML-Seite in einen
Webbrowser.
Was erwarten Sie?
„XML“ Webseite
2
September 2012
Sie sehen tatsächlich nur den Code, den Sie eingetippt haben. Ihr Browser zeigt den
Code richtig an. Betrachten Sie die Ausgabe einmal genauer. Das <?xml>-Tag wird
komplett in Blau dargestellt, während von den beiden Tags <AUSGABE> und
</AUSGABE> nur die Klammern und der "Slash" in Blau ausgegeben werden.
Verändern Sie nun das Tag </AUSGABE> z.B. in </AUSGABe>. Der Webbrowser
wird nun eine Fehlermeldung ausgeben. Der Browser erkennt also, dass ein
Schlusstag verwendet wurde, welches nicht mit dem öffnenden Tag übereinstimmt.
Wenn eine XML-Datei in einen Browser geladen wird, startet vor der Anzeige ein
sogenannter Parser, der den XML-Quellcode durchgeht und die Syntax des Codes
überprüft. Dieser Parser ist in aktuellen Browsern integriert. Microsoft hat einen
eigenen Parser "msxml" entwickelt, während Netscape auf "expat" von James Clark
setzt. Der Parser zeigt bei Fehlern die genaue Position im Code an, so dass man
Programmierfehler leicht finden kann.
„XML“ Webseite
3
September 2012
2.2 Tags definieren
Damit das Tag <AUSGABE> etwas bewirkt muss es auch richtig definiert werden.
Ein Tag wird im sogenannten Prolog definiert. Das ist direkt hinter dem Tag <?xml>.
Der Quellcode
<?xml version="1.0"?>
<!DOCTYPE Definitions_Name [
<!ELEMENT AUSGABE (#PCDATA)>
]>
<AUSGABE>Hallo World!</AUSGABE>
Nach dem <?xml>-Tag folgt das <!DOCTYPE>-Tag. Dies ist das Schlüsseltag, das die
Definition einleitet. Danach folgt der Name dieser Definition. Es ist nicht der Name des Tags,
den wir definieren wollen, sondern nur der Name der Definition. Danach öffnet sich eine
eckige Klammer. Alle nachfolgenden Einträge definieren nun konkret das Tag.
In der nächsten Zeile erscheint das <!ELEMENT>-Tag. Dadurch wird nun das konkrete Tag
definiert. Nach ELEMENT wird der Name des Tags geschrieben (in unserem Fall
AUSGABE) und anschliessend in runden Klammern das Schlüsselwort #PCDATA. Dies teilt
dem Browser mit, dass innerhalb des Tags normale Zeichen stehen dürfen, aber
beispielsweise keine Grafiken.
PCDATA seht für Parsed Character Data. Die Inhalte, die als PCDATA definiert sind, werden
vom Parser überprüft. Bei nicht syntaktisch korrekten Angaben wird ein Fehler gemeldet.
Die Definition des Tags wird danach mit der eckigen und der spitzen Klammer
abgeschlossen. Damit endet auch der Prolog der XML-Datei. Erst danach darf das definierte
Tag verwendet werden.
Diese Definition des Tags innerhalb des Prologs werden als DTD (Document Type
Definition) bezeichnet.
Betrachten wir die Definition einer kleinen Datenbank:
<?xml version="1.0"?>
<!DOCTYPE Adresse_def [
<!ELEMENT Adresse (Datensatz)+>
<!ELEMENT Datensatz (Name, Vorname, Strasse, PLZ, Ort,
Telefon)>
<!ELEMENT Name (#PCDATA)>
<!ELEMENT Vorname (#PCDATA)>
<!ELEMENT Strasse (#PCDATA)>
<!ELEMENT PLZ (#PCDATA)>
<!ELEMENT Ort (#PCDATA)>
<!ELEMENT Telefon (#PCDATA)>
]>
<Adresse>
<Datensatz>
<Name>Muster</Name>
<Vorname>Hans</Vorname>
<Strasse>Rosenweg 10</Strasse>
<PLZ>4500</PLZ>
<Ort>Solothurn</Ort>
<Telefon>062 298 23 43</Telefon>
</Datensatz>
</Adresse>
„XML“ Webseite
4
September 2012
Hier wurden sechs Tags in der DTD definiert. Dazu wurde im Wurzelelement
Adresse innerhalb der DTD die sechs Tags nacheinander in runden Klammern
aufgelistet.
XML ist streng hierarchisch aufgebaut. Das Tag <Name> ist dem Tag <Adresse>
untergeordnet. Das Haupttag (Wurzeltag oder Root Element) entspricht dem
<BODY>-Tag in HTML. Dieses Tag darf nur einmal vorkommen. Alle anderen Tags
sind Äste oder Zweige des Wurzeltags.
Das Pluszeichen hinter "Datensatz" zeigt an, dass mindestens ein Datensatz-Tag
vorkommen muss.
2.3 Kommentare in XML
Die Kommentare in XML entsprechen den Kommentaren in HTML:
<!-- Das ist ein Kommentar -->
2.4 XML mittels CSS im Browser ansehen
Prinzipiell wird für XML zur Ausgabe XSL(Extensible Stylesheet Language)
eingesetzt. Die einfachste Art, XML-Dokumente anzuzeigen, ist mittels der bereits
bekannten CSS (Cascading Style Sheets). Das Anzeigen der Daten mittels CSS ist
bedeutend einfacher als mittels XSL. Mit XSL haben Sie aber bedeutend mehr
Möglichkeiten als nur Dokumente anzuzeigen.
<?xml version="1.0"?>
<?xml-stylesheet href="test.css" type="text/css"?>
<Homepage>
<Ueberschrift>XML mit CSS ausgeben...</Ueberschrift>
<Text>Toller Test...</Text>
<Ueberschrift>Funktioniert im IE</Ueberschrift>
</Homepage>
Die CSS-Datei sieht folgendermassen aus:
Ueberschrift
{
font-family:arial;
font-size:35pt;
color:red;
}
Text
{
font-family:times;
font-size:20pt;
color:blue;
background-color:yellow;
}
„XML“ Webseite
5
September 2012
2.5 HTML-Tags in XML eingesetzt
Sie haben die Möglichkeit, sämtliche HTML-Tags innerhalb von XML einzusetzen.
Sie können auch spezifische Tags, wie z.B. <MARQUEE>, welches nur vom InternetExplorer unterstützt wird, einbauen.
HTML-Tags werden wie folgt eingebaut:
<html:BR></html:BR>
oder:
<html:HR></html:HR>
<html:a href="http://www.fhnw.ch"> Schule </html:a>
<html:marquee> Dies ist eine Laufschrift </html:marquee>
Damit diese Tags aber auch umgesetzt werden, ist es in XML nötig einen
"Namensraum" (Namespace) zu definieren. Da XML das Tag <html:BR> nicht
finden kann, würde dies zu einer Fehlermeldung führen (oder der Tag wird einfach
nicht umgesetzt). Ein Namespace wird im Wurzeltag wie folgt definiert:
<Adresse xmlns:html="http://www.w3.org/TR/REC-html40">
xmlns steht für XML Namespace. Es wird der Namensraum html definiert. Nur mit
dieser Namensraumdefinition können HTML-Tags verwendet werden.
Weshalb Namensräume? Stellen Sie sich vor, Sie laden externe XML-Dateien. Jetzt
könnte es sein, dass es dieselben Tags mit unterschiedlichen Definitionen gibt. Um
solche Konflikte zu vermeiden wurden die sogenannten Namespaces vom W3Konsortium 1999 standardisiert.
„XML“ Webseite
6
September 2012
2.6 Interne und externe DTD
Bis jetzt kennen Sie die DTD nur innerhalb des XML-Dokuments. Sie haben jedoch
die Möglichkeit die DTD auszulagern.
Dadurch trennen Sie die Definitionen von den Daten. Dies erhöht die
Übersichtlichkeit und wird deshalb empfohlen.
Eine externe DTD wird wie folgt eingebunden:
<?xml version="1.0"?>
<!DOCTYPE Adresse SYSTEM "daten.dtd">
<!-- anschliessend folgen die XML-Tags -->
Nach DOCTYPE wird der Name der DTD angegeben. Das Schlüsselwort SYSTEM
teilt dem Browser mit, dass die DTD, die geladen wird, nur für diese Webseite gilt.
Der Name der DTD folgt danach in Anführungsstrichen.
Die externe DTD ist fast identisch mit der internen DTD. Der einzige Unterschied liegt
darin, dass am Anfang der externen DTD das <!DOCTYPE>-Tag fehlt. Dieses ist
innerhalb des XML-Codes vorhanden und darf hier nicht noch einmal erscheinen.
Unsere externe DTD für die Datenbank würde wie folgt aussehen:
<!ELEMENT Adresse (Datensatz)+>
<!ELEMENT Datensatz (Name, Vorname?, Strasse, PLZ, Ort,
Telefon)>
<!ELEMENT Name (#PCDATA)>
<!ELEMENT Vorname (#PCDATA)>
<!ELEMENT Strasse (#PCDATA)>
<!ELEMENT PLZ (#PCDATA)>
<!ELEMENT Ort (#PCDATA)>
<!ELEMENT Telefon (#PCDATA)>
Das Fragezeichen hinter dem Tag "Vorname" zeigt an, dass dieses Tag optional ist
und deshalb auch wegfallen kann.
2.7 Eigene Attribute definieren
Bereits von HTML wissen Sie, dass einzelne Tags auch unterschiedliche Attribute
besitzen können (z.B. der FONT-Tag kennt die Attribute COLOR, FACE und SIZE).
Attribute können wir in XML zu jedem Tag selbst definieren. Das ist sehr sinnvoll,
weil wir dadurch den Inhalt des Tags genauer definieren können.
In unserem Beispiel mit den Datensätzen könnten die Adressen z.B. privat oder
geschäftlich sein. Dies können wir wie folgt lösen:
<Datensatz>
<Nachname>Meier</Nachname>
<Strasse art="privat">Rosenweg</Strasse>
<PLZ art="privat">4500</PLZ>
<Ort art="privat">Solothurn</Ort>
<Telefon art="privat">032 234 53 45</Telefon>
</Datensatz>
„XML“ Webseite
7
September 2012
Das Attribut "art" wird innerhalb der DTD definiert. Dazu wird das Tag <!ATTLIST>
verwendet:
<!ATTLIST Strasse art (privatgeschaeft) #REQUIRED>
Hinter der Definition des Attributs "art" wird in runden Klammern angegeben, welche
Werte möglich sind. Am Schluss der Definition folgt das Wort #REQUIRED, was
bedeutet, dass das Attribut art immer in Verbindung mit dem Tag Strasse
verwendet werden muss.
Anstelle von #REQUIRED kann ein Attribut auch als #IMPLIED definiert werden, das
bedeutet, dass das Attribut gesetzt werden kann, aber nicht unbedingt notwendig ist.
3. XML mit XSL
XML selbst legt die Daten strukturiert ab. Für eine formatierte Ausgabe von XML im
Webbrowser haben wir bis jetzt CSS verwendet. Es gibt für die Formatierung von
XML eine eigene Sprache nämlich XSL (Extensible Stylesheet Language). XSL ist
eine umfangreiche Sprache für Formatierungen von unterschiedlichen
Ausgabemedien. Wir möchten hier nur ein Beispiel betrachten.
Folgende XML-Datei bindet in der zweiten Zeile anstelle einer CSS-Datei eine XSLDatei ein:
<?xml version="1.0"?>
<?xml-stylesheet href="anzeige.xsl" type="text/xsl"?>
<ausgabe>
<anzeige> XML mit XSL </anzeige>
</ausgabe>
Der folgende Code zeigt, wie ein typisches Stylesheet in XML aussieht. Zuerst muss
wieder ein xsl-Namensraum definiert werden. Anschliessend folgt zwischen den
Schlüsselwörter template die konkrete Ausgabe des Inhalts.
<xsl:stylesheet xmlns:xsl="http://www.w3.org/TR/WD-xsl">
<xsl:template>
<H1>
<xsl:value-of select="ausgabe/anzeige" />
</H1>
</xsl:template>
</xsl:stylesheet>
Zwischen den Tags <H1> und </H1> lesen wir nun was ausgegeben werden soll. Es
handelt sich um den Inhalt des Tags <anzeige>. Über das Wort select legen wir
sozusagen den Fokus auf dieses Tag. Dazu muss man den gesamten
Dokumentenbaum (vom Wurzelelement her) angeben.
Die Ausgabe sollte dann im Webbrowser wie folgt aussehen:
„XML“ Webseite
8
September 2012
Im nächsten Beispiel wird gezeigt, wie man den Inhalt mehrerer Tags ausgeben
kann. Beachten Sie wie der XSL-Code modifiziert wurde:
Der XML-Code:
<?xml version="1.0"?>
<?xml-stylesheet href="anzeige2.xsl" type="text/xsl"?>
<ausgabe>
<start>
<anzeige> XML mit XSL </anzeige>
</start>
<start>
<anzeige> HTML-Tags fuer die Formatierung </anzeige>
</start>
<start>
<anzeige> XSL ist nicht so komliziert! </anzeige>
</start>
</ausgabe>
Der XSL-Code:
<xsl:stylesheet xmlns:xsl="http://www.w3.org/TR/WD-xsl">
<xsl:template>
<xsl:for-each select="ausgabe/start">
<H1>
<xsl:value-of select="anzeige" />
</H1>
</xsl:for-each>
</xsl:template>
</xsl:stylesheet>
Das neue Tag <xsl:for-each> weist den Browser an, nach allen Tags zu suchen,
die mit dem Wert in Attribut select übereinstimmen.
„XML“ Webseite
9
September 2012
4. Weitere Adressen und Hilfen zu XML
-
de.selfhtml.org/xml
www.xmlguru.de
www.w3.org/TR/1998/REC-xml-19980210
www.xml.com
„XML“ Webseite
10
September 2012

Documentos relacionados