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