In diesem Tutorial werden wir in die Welt von XSL (T) eintauchen und erklären, was es ist, wie man Daten aus einem XML-Dokument holt, grundlegende Iterationen und grundlegende Anmelde- und Bedingungsanweisungen.

Tutorial-Details

• Programm: Beliebiger Texteditor
• Ausführung: 1 von 1
• Schwierigkeit: Mittel
• Geschätzte Fertigstellungszeit: 25 min

Überblick

Manchmal gibt es riesige Datensätze, die als XML analysiert werden und formatiert werden müssen, damit jemand, der nicht weiß, wie man XML liest, die Daten lesen kann. In diesem Tutorial zeige ich Ihnen, wie das mit XSL (T) funktioniert..

Was ist XSL (T)?

XSL (T) ist eine Abkürzung für Extendable Stylesheet Language (Transformation). Obwohl es sich um ein "Stylesheet" handelt, verfolgt es ein anderes Ziel als CSS (Cascading Stylesheets). XSL (T) wird nicht für visuelle Effekte verwendet, sondern extrahiert stattdessen Daten (oder Transformationen) aus XML und verwendet die Kombination aus HTML und CSS zum Formatieren. XSL (T) hat auch die dynamischen Eigenschaften in dem Sinne, dass Sie Iterationen und Bedingungsanweisungen für eine statische XML-Datei ausführen können.

XSL (T) wird nicht für visuelle Effekte verwendet, sondern extrahiert stattdessen Daten (oder Transformationen) aus XML und verwendet die Kombination aus HTML und CSS zum Formatieren.

Warum XSL verwenden (T)?

XSL (T) kann zum Organisieren großer XML-Bäume verwendet werden, sodass jeder es lesen kann. Beispielsweise stellt eine Google Search Appliance Abfragen als XML bereit. Damit dieses XML von einem allgemeinen Benutzer gelesen werden kann, muss es einige Transformationen geben. Hier spielt XSL (T) eine entscheidende Rolle. Es kann auch zum Gestalten einer RSS-Feed-Seite verwendet werden, da die Quelle alles in XML ist. Es wird auch als Hauptvorlagensprache für Autonomy Teamsite (EMS) und Open Source-CMSs wie Symphony verwendet.

XSL (T) reduziert auch die Serverlast. Da XSLT die Umwandlung auf der Clientseite durchführen kann, muss Ihr Server weniger Arbeit verrichten, da Sie keine Daten in der Datenbank abfragen. JavaScript und serverseitige Funktionen können eingerichtet werden, um dem Dokument mitzuteilen, dass es eine bestimmte XSL (T) -Vorlage verwendet, oder Sie können die Vorlage innerhalb der eigentlichen XML-Datei als Quelle verwenden. Für dieses Lernprogramm wird lediglich die XSL (T) -Vorlage in der XML-Datei bereitgestellt.

Fertig machen

Unser Ziel ist es, eine Liste von Urlauben zu erstellen, die wir fortsetzen möchten, und eine Logik der Daten zu verwenden, um uns mitzuteilen, welche Ziele außerhalb unseres Preisbereichs liegen. In diesem Fall beträgt unser Budget 999 US-Dollar für unseren Urlaub und wir geben an, wann der Preis über unserem Budget liegt. Wir werden sie auch in absteigender Reihenfolge bestellen, so dass wir sofort sehen können, welche Reisen unser Budget überschreiten.

Zunächst benötigen Sie eine XML-Datei. Öffnen Sie Ihren bevorzugten Texteditor, erstellen Sie eine neue Datei und nennen Sie diese Datei trips.xml. Ich habe eine XML-Beispieldatei bereitgestellt, die Sie herunterladen und verwenden können, oder Sie können den folgenden Code kopieren und einfügen.

     Vereinigte Staaten von Amerika Florida Orlando 1000   Vereinigte Staaten von Amerika Michigan Detroit 600   Spanien Madrid 5000   Vereinigte Staaten von Amerika Kalifornien San Jose 800  

Das erste und einzige, was wir für dieses Dokument tun müssen, ist, einen Verweis darauf hinzuzufügen, wo sich unsere .xsl-Datei befindet. In diesem Fall erstellen wir ein Stylesheet namens trips.xsl.

  … 

Das erweiterbare Stylesheet beginnen

Erstellen Sie zunächst ein neues Dokument in Ihrem bevorzugten Texteditor und speichern Sie es als trips.xsl. Als Nächstes können wir das eigentliche Stylesheet starten. Zuerst müssen Sie die XML-Version und die Codierung für die Vorlage angeben. Wenn Sie mit XML vertraut sind, haben Sie dieselbe Versions- und Codierungssyntax

 … 

Von hier aus können wir etwas XSL schreiben. Um das Stylesheet zu starten, müssen wir dem Browser zunächst mitteilen, dass wir ein XSL-Stylesheet verwenden und welche Version verwendet wird. Dieses Element muss alle Markierungen einschließen und sollte am Ende des Dokuments geschlossen werden. Andernfalls wird das Dokument nicht umgewandelt.

    … 

Wenn wir die XHTML in unserem Dokument gegen W3C-Standards validieren möchten, müssen wir einen Doctype hinzufügen, der bei der Transformation und beim Rendern verwendet werden soll. Hier verwenden wir die XHTML-Strict-DTD. Wir machen dies, indem wir ein selbstschließendes Element einrichten xsl: ausgabe. Mit in diesem Element nennen wir den Doctype.

     … 

Als Nächstes starten wir die eigentliche Vorlage. Zwischen dem Open- und Close-Tag des Templates befinden sich alle XHTML-Elemente und alle anderen XSL (T) -Elemente. Es ist wichtig zu beachten, dass Sie a eingestellt haben Spiel für die Vorlage. Dieses Attribut besagt im Wesentlichen "go to the root" des XML-Dokuments.

Transformation

Als erstes müssen wir ein grundlegendes XHTML-Layout starten und dieses in unserem verschachteln xsl: vorlage Stichworte. Ich habe auch eine CSS-Datei mit einem Dokument verknüpft, um dem Dokument einen Stil zu verleihen, aber das Festlegen des Setups geht über den Rahmen dieses Tutorials hinaus.

…          … 

Unser erstes Ziel ist es also, das Titelelement aus dem XML-Dokument zu entnehmen und diese Daten in den Titel des HTML-Dokuments einzufügen.

Bevor wir mit dem XSL beginnen, ist es wichtig zu beachten, wo sich im XML-Baum "title" befindet. In diesem Fall ist der Titel ein direkter Nachkomme des Wurzelelements Urlaub. Wir können jetzt mit dem Schreiben unserer XSL beginnen. Um dem Browser mitteilen zu können, wo eine übereinstimmende Datenmenge leben wird, verwenden wir das Element xsl: value-of.

Wir befinden uns bereits in der Wurzel des Dokuments durch das xsl: template-Tag, aber wir müssen tiefer in die XML-Baumstruktur einsteigen, um die gewünschten Daten auszuwählen. In diesem Fall werden wir im Dokument nach einem Grundelement des Urlaubs mit dem Titelkind suchen.

…    … 

Wenn wir unsere XML-Datei (trips.xml) im Browser öffnen, ist das Ergebnis das Titelelement, das in der Titelleiste des Browsers angezeigt wird. Wir erwarten, dass es sich auf einer normalen XHMTL-basierten Site befindet. Beachten Sie auch, dass wir die XML-Baumstruktur nicht mehr sehen. Wenn Sie jedoch den Quelltext anzeigen, sehen Sie, dass der Quellcode des Dokuments XML ist.

Wir können noch einen Schritt weiter gehen, um zu beweisen, dass die Umwandlung von XML in XHTML im Browser mithilfe eines Tools wie FireBug oder Safari Inspector stattgefunden hat.

Um eine visuelle Organisation hinzuzufügen, füge ich einige Markierungen hinzu, damit unsere Daten ein bisschen leichter zu sehen sind.

…   
 
 
 
  
 
 
… 

Wie Sie oben sehen können, habe ich das Titelelement erneut verwendet, diesmal jedoch im Hauptteil des Dokuments. Dies kann bei der Wiederverwendung und Wiederverwendung von Inhalten äußerst nützlich sein.

Als nächstes wollen wir unsere "Trips" in XHTML umwandeln. Der gesunde Menschenverstand sagt, dass wir einfach einen anderen anrufen können xsl: Wert von aber diesmal ruft der untergeordnete Knoten "Reise" auf. Dies würde funktionieren, wenn wir nur eine Reise hätten. Da wir jedoch mehrere Reisen haben, müssen wir das XML-Dokument durchlaufen oder durchlaufen.

Iteration aka Looping

Wie in allen Programmiersprachen gibt es Iterationsanweisungen, die eine bestimmte Datenmenge durchlaufen und einige Methoden für sie ausführen. XLS (T) hat eine ähnliche Funktionalität beim Extrahieren von Daten aus einem XML-Dokument.

… … … 

Das obige Snippet macht ziemlich genau das, was Sie erwarten würden. Es heißt xsl: for-each Wählen Sie alle Elemente aus, die am Pfad vorhanden sind Urlaub / Tipp.

Um die Daten tatsächlich extrahieren zu können, müssen wir jedoch noch ein bisschen mehr arbeiten. Da unser Budget für die Reisen 999 US-Dollar beträgt, müssen wir eine gewisse Logik für die Daten erstellen. Aber bevor wir das tun, können wir die Daten nach Preis in absteigender Reihenfolge sortieren.

Sortierung

…  … … 

Wie Sie oben sehen können, ist das Sortieren von Daten nach einem bestimmten Knoten relativ einfach. Seit der xsl: for-each Die Anweisung wählt den Auslöseknoten aus und legt den Umfang fest, den wir einfach sagen können xsl: sortieren Wählen Sie den Preisknoten und suchen Sie nach Datentyp Nummer dann stellen Sie das ein Auftrag zu absteigend. Es ist wichtig zu beachten, dass die xsl: sortieren Anweisung ist selbstschließend ().

Vorschau

An diesem Punkt fragen Sie sich vielleicht, wie diese Urlaubsliste aussieht. Um zu sehen, was wir geöffnet haben trips.xml in Ihrem Browser Vergewissern Sie sich, dass Sie das nicht sehen .xsl Datei.

Sie kratzen sich wahrscheinlich am Kopf und fragen sich, warum wir keine Ergebnisse haben. Dies liegt daran, dass wir nicht ermittelt haben, welche Daten betrachtet werden sollen. Das xsl: sortieren Die Anweisung bezieht sich nicht auf Daten, sondern lediglich auf das Vorhandensein von Daten.

Auswählen und testen

Da wir einen Hinweis auf Preise geben möchten, die außerhalb unseres Budgets liegen, müssen wir dies tun Prüfung gegen einige Parameter. Wir machen das mit der Kombination von xsl: wählen, xsl: when test = " und xsl: sonst. Wenn Sie Programmiererfahrung haben, sollten Sie dieses Konzept der Flusskontrolle von Bedingungen kennen. Wenn nicht, ist es immer noch ziemlich einfach zu folgen.

     BLAH   BLIP   

Wir beginnen den Logikfluss mit xsl: wählen, Dies wird die Anweisung ähnlich wie initialisieren ob in Sprachen wie PHP. Direkt danach haben wir unser erstes Prüfung. Wir sagen XSL (T) dazu wann der Preis ist größer als (>) 999 do BLAH, ansonsten BLIP.

Als Nächstes müssen wir BLAH und BLIP durch Haken an unserem XML ersetzen.

…   
$ ,    
  …  … 

Im obigen Snippet richten wir unser Listenelement mit einer Klasse von "zu viel" ein. Diese Klasse färbt die Reisen aus unserem Budget rot. Wir benutzen dann xsl: Wert von Preis, Stadt, Bundesland, Land und Datum. Es ist wichtig zu beachten, dass das Datum von jedem "Reise" -Knoten aus mit dem @ -Symbol abgerufen werden kann. Dieselben Arten von Aussagen wurden schon früher gesehen, als Sie den Titel unserer Liste erhielten. Wir haben auch das Dollar-Symbol ($) und das Komma () hinzugefügt, um die Daten korrekt zu formatieren.

   
$ ,    
   
$ ,    
  

Als Nächstes müssen wir angeben, was wir mit den anderen Artikeln tun möchten, wenn sie unsere Einschränkung von unter 999 $ erfüllen. In diesem Fall drucken wir sie einfach in einem Listenelement aus, an das keine spezielle Klasse angehängt ist. Wir gehen durch und wählen alle Knoten aus, die wir für den Knoten getan haben zu viel Knoten (Preis, Stadt, Bundesland, Land und Datum).

Alles zusammenlegen

           
 
 
 
     
$ ,    
   
$ ,    
    
 
 
    

Zu diesem Zeitpunkt sollten wir tatsächlich etwas Nützliches im Browser sehen können.

Öffnen Sie die trips.xml wie zuvor. Wenn alles gut gegangen ist, sollten Sie etwas Ähnliches wie oben gezeigt haben. XSL (T) ist eine sehr leistungsfähige Sprache, mit der Sie die Darstellung von XML-Daten drastisch ändern können. Im Folgenden finden Sie einige Ressourcen, um mehr über XSL (T) zu erfahren..

• W3C-Dokumentation
• W3C Schulen XSL
• XSLT Wikipedia
• XSLT Second Edition von Doug Tidwell

Schreibe ein Plus-Tutorial

Wussten Sie, dass Sie bis zu 600 US-Dollar verdienen können, wenn Sie ein PLUS-Tutorial und / oder einen Screencast für uns schreiben? Wir suchen ausführliche und gut geschriebene Tutorials zu HTML, CSS, PHP und JavaScript. Wenn Sie die Möglichkeit haben, wenden Sie sich bitte an Jeffrey unter [email protected].

Bitte beachten Sie, dass die tatsächliche Kompensation von der Qualität des abschließenden Tutorials und des Screencasts abhängt.

• Folgen Sie uns auf Twitter oder abonnieren Sie den Nettuts + RSS-Feed für die besten Webentwicklungs-Tutorials im Web.