User Tools

Site Tools


xsl

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

xsl [2011/03/04 17:58] (current)
ginko created
Line 1: Line 1:
 +====== XSL ======
 +eXtensible Stylesheet Language.
  
 +Un langage de transformation de documents XML.
 +
 +===== Exemples =====
 +==== Affichage d'un document XML (en HTML) ====
 +Un petit document XSL pour visualiser un document XML sous forme de document HTML:
 +<code xml><?​xml version="​1.0"?>​
 +<​xsl:​stylesheet version="​1.0"​ xmlns:​xsl="​http://​www.w3.org/​1999/​XSL/​Transform"​ xmlns="​http://​www.w3.org/​1999/​xhtml">​
 +    <!-- Main -->
 +    <​xsl:​template match="/">​
 +        <html xmlns="​http://​www.w3.org/​1999/​xhtml">​
 +            <​head>​
 +                <​title>​Title</​title>​
 +                <link rel="​stylesheet"​ type="​text/​css"​ href="​style_xsl.css"​ />
 +            </​head>​
 +            <​body>​
 +                <!-- Go! -->
 +                <​xsl:​apply-templates select="​*"/>​
 +            </​body>​
 +        </​html>​
 +    </​xsl:​template>​
 +    <!-- Versatile template (recursive) -->
 +    <​xsl:​template match="​*">​
 +        <!-- Grab current element'​s name -->
 +        <​xsl:​variable name="​tag_name"><​xsl:​value-of select="​local-name()"​ /></​xsl:​variable>​
 +        <!-- Build a div for each element with the element name as class name -->
 +        <div class="​{$tag_name}">​
 +        <!-- Print the element name as a label followed by corresponding value -->
 +        <span class="​label"><​xsl:​value-of select="​$tag_name"​ /></​span>​ : <span class="​value"><​xsl:​value-of select="​text()"​ /></​span>​
 +        <!-- If current node has a child, recurse! -->
 +        <xsl:if test="​*">​
 +            <​xsl:​apply-templates/>​
 +        </​xsl:​if>​
 +        </​div>​
 +    </​xsl:​template>​
 +</​xsl:​stylesheet></​code>​
 +Ce code récursif est versatile : il est capable d'​afficher n'​importe quel document XML. Il fournit également de nombreuses classes afin de styliser facilement l'​affichage à l'aide d'une CSS.
 +
 +Il est possible d'​ajouter du javascript et du CSS interactif (hover) : par exemple un bouton pour plier/​déplier une section.
 +=== Pistes d'​amélioration ===
 +  * Afficher les attributs
 +  * Calculer le niveau de récursion afin d'​obtenir des class ou id encore plus puissantes.
xsl.txt · Last modified: 2011/03/04 17:58 by ginko