Mise en forme à l'aide de feuilles de style XSL
IV. Conception modulaire des feuilles de style 1 Introduction
Les feuilles de style que nous avons écrites jusqu'à présent conviennent à de petits projets. Cependant, lorsqu'un développement doit être réalisé à plusieurs, ou lorsqu'il devient nécessaire de revenir après quelque temps sur du code déjà écrit, la possibilité de mettre au point des feuilles de style modulaires prend toute sa valeur. Deux étages successifs le permettent :
1. Au sein d'une même feuille de style, la séparation du traitement de chaque nœud peut se faire en généralisant l'emploi des templates ;
2. Il est possible de scinder une feuille de styles en plusieurs fichiers, inclus les uns dans les autres.
2. Utilisation des templates a. Introduction
14 / 16 XPath_XSLT Les feuilles de style que nous avons écrites jusqu'à présent utilisaient l'élément xsl:for-each pour « inspecter » successivement tous les éléments renvoyés par une expression XPath. Lorsque le document XML initial ou le document de sortie deviennent un peu complexes, cette méthode aboutit à l'écriture d'une feuille de style consistant en de multiples boucles imbriquées. Une solution commode est alors de séparer les traitements pour chaque nœud du document initial grâce aux éléments xsl:template.
b. Exemple
Revenons à la deuxième feuille de style que nous avions écrite pour présenter la liste des bouteilles : <?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="/">
<html> <head>
<title>Exemple de sortie HTML</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" /> </head>
<body>
<h1>Bouteille de marque <xsl:value-of select="bouteille/marque" /></h1> <h2>Composition:</h2>
<h3>Ions positifs</h3> <ul>
<xsl:for-each select="bouteille/composition/ion_positif"> <li><xsl:value-of select="." /></li>
</xsl:for-each> </ul>
<h3>Ions négatifs</h3> <ul>
<xsl:for-each select="bouteille/composition/ion_negatif"> <li><xsl:value-of select="." /></li>
</xsl:for-each> </ul>
<h3>Autres matériaux</h3> <ul>
<xsl:for-each select="//autres_materiaux"> <li><xsl:value-of select="." /></li> </xsl:for-each>
</ul>
<h2>Lieu d'origine</h2>
<p>Ville de <b><xsl:value-of select="bouteille/source/ville" /></b>, dans le département <b><xsl:value-of select="bouteille/source/departement" /></b></p> <h2>Autres informations</h2>
<ul>
<li>Contenance: <xsl:value-of select="bouteille/contenance" /></li> <li>pH: <xsl:value-of select="bouteille/ph" /></li>
</ul> </body> </html>
</xsl:template> </xsl:stylesheet>
Modifions-la dans un premier temps afin qu'elle puisse s'adapter à un document XML listant plusieurs bouteilles :
<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="/">
<html> <head>
<title>Exemple de sortie HTML</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" /> </head>
<body>
<h1>Bouteille de marque <xsl:value-of select="bouteille/marque" /></h1> <h2>Composition:</h2>
<h3>Ions positifs</h3> <ul>
<xsl:for-each select="bouteille/composition/ion_positif"> <li><xsl:value-of select="." /></li>
</xsl:for-each> </ul>
<h3>Ions négatifs</h3> <ul>
<xsl:for-each select="bouteille/composition/ion_negatif"> <li><xsl:value-of select="." /></li>
</xsl:for-each> </ul>
<h3>Autres matériaux</h3> <ul>
<xsl:for-each select="//autres_materiaux"> <li><xsl:value-of select="." /></li> </xsl:for-each>
</ul>
<h2>Lieu d'origine</h2>
<p>Ville de <b><xsl:value-of select="bouteille/source/ville" /></b>, dans le département <b><xsl:value-of select="bouteille/source/departement" /></b></p> <h2>Autres informations</h2>
<ul>
<li>Contenance: <xsl:value-of select="bouteille/contenance" /></li> <li>pH: <xsl:value-of select="bouteille/ph" /></li>
</ul> </xsl:for-each> </body> </html> </xsl:template> </xsl:stylesheet>
Les imbrications de boucles xsl:for-each peuvent devenir lourdes à gérer. Il est plus facile de maintenir la structure suivante :
<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:output method="html" version="html4.01" encoding="ISO-8859-1" doctype-public="- //W3C//DTD HTML 4.01//EN" doctype-system="http://www.w3.org/TR/html4/strict.dtd" /> <xsl:template match="/">
<html> <head>
<title>Exemple de sortie HTML</title> </head> <body> <xsl:apply-templates /> </body> </html> </xsl:template> <xsl:template match="bouteille">
<h1>Bouteille de marque <xsl:value-of select="marque" /></h1> <h2>Composition:</h2> <h3>Ions positifs</h3> <ul> <xsl:for-each select="composition/ion_positif"> <xsl:apply-templates select="." /> </xsl:for-each> </ul> <h3>Ions négatifs</h3> <ul>
16 / 16 XPath_XSLT <xsl:apply-templates select="." /> </xsl:for-each> </ul> <h3>Autres matériaux</h3> <ul> <xsl:for-each select="autres_materiaux"> <xsl:apply-templates select="." /> </xsl:for-each> </ul> <h2>Lieu d'origine</h2>
<p>Ville de <b><xsl:value-of select="source/ville" /></b>, dans le département <b><xsl:value-of select="source/departement" /></b></p>
<h2>Autres informations</h2> <ul>
<li>Contenance: <xsl:value-of select="contenance" /></li> <li>pH: <xsl:value-of select="ph" /></li>
</ul>
</xsl:template>
<xsl:template match="ion_positif"> <li><xsl:value-of select="." /></li> </xsl:template>
<xsl:template match="ion_negatif"> <li><xsl:value-of select="." /></li> </xsl:template>
<xsl:template match="autres_materiaux"> <li><xsl:value-of select="." /></li> </xsl:template>
</xsl:stylesheet>
Le gain n'est pas très appréciable ici, mais si vous jetez un œil à la feuille de style qui figure en lien en bas de cette page, vous verrez un exemple d'utilisation plus complexe... et plus utile.
3. Inclusions de feuilles de style
Il est parfois nécessaire de scinder une feuille de style en plusieurs fichiers différents : Cela permet d'en faciliter la maintenance, en rendant possible un travail collectif ;
Cela permet aussi de créer des bibliothèques de modèles pouvant être réutilisés d'un projet à un autre
Pour cela, il suffit de spécifier dans la feuille de style « maîtresse » un appel à une feuille de style autre, soit par l'élément xsl:include soit par l'élément xsl:import. Par exemple...
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:include href="feuille_incluse.xsl" />
</xsl:stylesheet>
Les modèles et variables définis dans la feuille de style ainsi incluse sont directement incorporés à la feuille de style appelante. Quand on utilise xsl:import, s'il y a conflit entre une déclaration de template dans la feuille appelante et la feuille appelée, c'est la première qui est prioritaire. La syntaxe est la même : <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:import href="feuille_incluse.xsl" />