XML et XSLT

Avec l'XSLT, vous pouvez convertir un document XML en HTML.

Affichage XML avec XSLT

XSLT(Langage de transformation de feuilles de style extensibles, eXtensible Stylesheet Language Transformations) est le langage de feuilles de style XML recommandé.

L'XSLT est beaucoup plus complexe que le CSS. Grâce à l'XSLT, vous pouvez ajouter ou supprimer des éléments et des attributs dans le fichier de sortie. Vous pouvez également réorganiser et trier les éléments, exécuter des tests et décider de masquer ou d'afficher certains éléments, etc.

L'XSLT utilise XPath pour trouver des informations dans le document XML.

Exemples XSLT

Nous utiliserons le document XML suivant :

<?xml version="1.0" encoding="UTF-8"?>
<breakfast_menu>
<food>
<name>Belgian Waffles</name>
<price>$5.95</price>
<description>Two of our famous Belgian Waffles with plenty of real maple syrup</description>
<calories>650</calories>
</food>
<food>
<name>Strawberry Belgian Waffles</name>
<price>$7.95</price>
<description>Light Belgian waffles covered with strawberries and whipped cream</description>
<calories>900</calories>
</food>
<food>
<name>Berry-Berry Belgian Waffles</name>
<price>$8.95</price>
<description>Light Belgian waffles covered with an assortment of fresh berries and whipped cream</description>
<calories>900</calories>
</food>
<food>
<name>French Toast</name>
<price>$4.50</price>
<description>Coupe épaisse fabriquée à partir de notre pain à levain maison</description>
<calories>600</calories>
</food>
<food>
<name>Breakfast à la maison</name>
<price>$6.95</price>
<description>Deux œufs, bacon ou saucisse, pain de toast et nos frites à la bière toujours populaires</description>
<calories>950</calories>
</food>
</breakfast_menu>

Avant de l'afficher dans le navigateur, convertissez l'XML en HTML en utilisant XSLT :

Exemple de style XSLT :

<?xml version="1.0" encoding="UTF-8"?>
<html xsl:version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<body style="font-family:Arial;font-size:12pt;background-color:#EEEEEE">
<xsl:for-each select="breakfast_menu/food">
  <div style="background-color:teal;color:white;padding:4px">
    <span style="font-weight:bold"><xsl:value-of select="name"/> - </span>
    <xsl:value-of select="price"/>
    </div>
  <div style="margin-left:20px;margin-bottom:1em;font-size:10pt">
    <p>
    <xsl:value-of select="description"/>
    <span style="font-style:italic"> (<xsl:value-of select="calories"/> calories per serving)</span>
    </p>
  </div>
</xsl:for-each>
</body>
</html>

Essayez-le vous-même

Tutoriel XSLT

Si vous souhaitez en savoir plus sur XSLT, veuillez visiter notre Tutoriel XSLT.