Les bases de la mise en forme XML avec XSLT

OpenClassrooms

Formation

En Ligne

Prix sur demande

Appeler le centre

180888030

Avez-vous besoin d'un coach de formation?

Il vous aidera à comparer différents cours et à trouver la solution la plus abordable.

Description

Typologie

Formation

Méthodologie

En ligne

Grâce à cette formation vous pourrez acquérir les connaissances nécessaires qui vous permettrons d’ajouter des compétences à votre profil et obtenir de solides aptitude qui vous offriront de nombreuses opportunités professionnelles.

Questions / Réponses

Ajoutez votre question

Nos conseillers et autres utilisateurs pourront vous répondre

À qui souhaitez-vous addresser votre question?

Tous
Aux étudiants
À l'établissement

Saisissez vos coordonnées pour recevoir une réponse

Nous ne publierons que votre nom et votre question

Les Avis

Le programme

Introduction du cours

Bienvenue dans mon tutoriel consacré au langage XSLT.

Vous avez envie de mettre en forme une page XML afin de pouvoir l'utiliser ?
Eh bien, le format XSLT est parfaitement adapté pour ça.

Je vais vous apprendre les techniques nécessaires en vue de créer un document XSLT, ainsi qu'à traiter et afficher des données XML.

XML et XSLT

Le XML est un langage de mise en forme de données utilisant des balises.

Si vous ne connaissez pas le XML, consultez ce tutoriel.

Il existe plusieurs moyens pour mettre en forme du XML, mais le plus puissant est le XSLT (le CSS est aussi utilisable, mais limité).
Comme vous vous en doutez, il s'agit du langage que nous allons étudier.

Lors d'exemples, je vais utiliser ce petit fichier XML tout simple :

<?xml version="1.0" encoding="utf-8"?> <test> <jeu id="1"> <nom>Guild Wars</nom> <type>Jeu de rôle en ligne</type> <prix>Environ 20 € l'épisode</prix> </jeu> <jeu id="2"> <nom>Super Mario Galaxy</nom> <type>Jeu de plate-forme</type> <prix>30-50 €</prix> </jeu> <jeu id="3"> <nom>Mario Sokoban</nom> <type>Jeu de réflexion</type> <prix>Gratuit</prix> </jeu> </test>

Créez un fichier que vous enregistrerez sous le nom « le_nom_que_vous_voulez.xml » et placez-y donc ce code. Allez, passons à présent aux choses sérieuses ! ;)

Création de la page XSLT

Commencez par créer un nouveau fichier que vous enregistrerez sous le nom « le_nom_de_votre_choix.xsl ».
Comme vous le constatez, l'extension d'un fichier XSLT est .xsl, ce qui n'est pas étonnant.

Vous avez donc une page vierge devant vous, mais qu'à cela ne tienne !
Mettons tout d'abord le code par défaut.

Il faut indiquer en premier la même version XML et le même encodage que la page XML. Pour cela, recopiez la première ligne du document XML, qui est dans mon cas :

<?xml version="1.0" encoding="utf-8"?>

Ensuite, si vous utilisez des entités dans la page XML (c'est-à-dire des choses telles que « é »), il vous faut les déclarer. Pour cela, écrivez à la suite :

<!DOCTYPE xsl:stylesheet [ <!ENTITY nbsp " "> <!ENTITY copy "©"> <!ENTITY reg "®"> <!ENTITY trade "™"> <!ENTITY mdash "—"> <!ENTITY ldquo "“"> <!ENTITY rdquo "”"> <!ENTITY pound "£"> <!ENTITY yen "¥"> <!ENTITY euro "€"> ]>

Je vous ai joint quelques entités par défaut, utiles en particulier si vous utilisez l'ISO pour l'encodage des caractères.

Les entités par défaut de XML n'ont pas besoin d'être déclarées (c'est-à-dire « < », « & », « > », « " » et « ' »).

Pour ajouter une entité, vous devez récupérer son nom (en principe, vous le possédez déjà) et son code. Pour cela, rendez-vous sur cette page.
Trouvez la ligne de l'entité recherchée, copiez le code (par exemple «   ») et écrivez ceci à la suite des entités déjà déclarées :

<!ENTITY le_nom "le_code">

Ensuite, nous allons ouvrir les premières balises XSLT en donnant aussi quelques informations.
Tapez donc ceci à la suite du code présent :

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:output method="html" encoding="utf-8" doctype-public="-//W3C//DTD XHTML 1.0 Transitional//EN" doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"/> <xsl:template match="/">

La première ligne renseigne la version de XSLT et désigne le namespace (xmlns:xsl) des balises XSLT, c'est-à-dire leur « préfixe ». La valeur par défaut est xsl, et je la conserverai tout au long du tutoriel.
La deuxième ligne donne des informations sur le format de la page après transformation. Dans le cas où vous en utilisez un autre, changez l'encodage.
La troisième ligne indique quelles balises seront concernées par le code qui s'y trouve. Vous pouvez en mettre plusieurs, comme une qui ne concernerait qu'un type d'élément si le fichier XML contenait plus d'un type de données.

Ensuite, c'est simple, vous placez le code de base d'un document XHTML :

<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>Mise en forme avec XSLT</title> </head> <body> </body> </html>

Vous pouvez utiliser tout code qu'une page HTML peut gérer (balises HTML classiques, CSS et même JavaScript).

Mais attention : il est impossible d'exploiter du contenu dynamique, tel que du PHP ou de l'ASP par exemple !

Après le code de base, il faut refermer les balises xsl :

</xsl:template> </xsl:stylesheet>

Et voilà ! La page XSLT est terminée ! Du moins, la base. Il faut maintenant rajouter le contenu XML.

Il est inutile d'essayer d'ouvrir la page XSLT, car elle ne contient que la mise en forme ! Nous verrons plus tard comment afficher le résultat.

Afficher du contenu XML

La page de base XSLT étant terminée, nous allons maintenant ajouter du contenu XML.

Pour faire simple, nous allons créer un tableau qui affichera le contenu d'une page XML.
Entre les balises <body></body> , écrivez ce code :

Maintenant, on souhaite afficher des données XML à la place des   .
Une balise XSL se présente sous cette forme :

<xsl:nom_de_la_balise attributs="valeurs" />

Comme je vous l'ai dit à propos des namespaces, le préfixe de la balise est xsl.
La balise permettant d'afficher du contenu est celle-ci :

<xsl:value-of select="test/jeu/@id"/>

Sachez que le XSLT utilise le langage XPath pour naviguer dans un fichier XML. Consultez ce lien pour plus d'informations.

Dans cet exemple, l'id de la première balise jeu dans la balise test sera sélectionné.
Lorsque l'on cible l'un des attributs d'une balise, on indique @ devant le nom de l'attribut.
Pour cibler le contenu d'une balise, on s'arrête à son nom.

Pour afficher toutes les informations de notre première balise jeu, on doit écrire :

Maintenant, vous savez afficher du contenu XML, mais je pense que vous avez envie de tester, non ? Eh bien, nous allons voir ça !

Lier la feuille XSLT au fichier XML

Comme je vous l'ai dit plus haut, il est inutile de visualiser la page XSLT. Il va falloir l'attacher à la page XML comme on attache un document CSS à une page HTML.
Pour cela, rien de plus simple !

Au début du fichier XML et après la première ligne, ajoutez la ligne suivante :

<?xml-stylesheet href="nom_de_la_feuille_xslt.xsl" type="text/xsl"?>

Après ça, essayez d'ouvrir le fichier XML… Et là, que voyez-vous ?
Un tableau avec les données de la première balise jeu !

Mais ce n'est pas vraiment ce qu'on recherche, on voudrait plutôt afficher tout le contenu !
Il va donc falloir utiliser une nouvelle balise XSL.

Régions répétées

Comme promis, nous allons évoquer une autre balise XSL.
La voici :

<xsl:for-each select="test/jeu"> </xsl:for-each>

Le contenu présent à l'intérieur de ces balises sera répété autant de fois qu'il y a de balises jeu dans le document XML.
Il faudrait donc écrire :

<xsl:for-each select="test/jeu"> <tr> <td><xsl:value-of select="test/jeu/@id"/></td> <td><xsl:value-of select="test/jeu/nom"/></td> <td><xsl:value-of select="test/jeu/type"/></td> <td><xsl:value-of select="test/jeu/prix"/></td> </tr> </xsl:for-each>

Sauf qu'en réalité, il ne faut pas remettre test/jeu/ car il est déjà écrit dans l'attribut select de <xsl:for-each> .

Le bon code est donc celui-ci :

<xsl:for-each select="test/jeu"> <tr> <td><xsl:value-of select="@id"/></td> <td><xsl:value-of select="nom"/></td> <td><xsl:value-of select="type"/></td> <td><xsl:value-of select="prix"/></td> </tr>

Essayez ce code et laissez la magie opérer ! L'intégralité du contenu de toutes les balises jeu est écrite noir sur blanc.

Les filtres

Généralement, vous ne souhaiterez pas afficher tout un document XML d'un coup : pour cela, il faudra utiliser les filtres.

Vous devez les mettre dans l'attribut select. Admettons que vous voulez afficher tous les jeux dont le nom est « Super Mario Galaxy ».

Vous devrez donc indiquer le filtre entre crochets, à côté de la balise que vous voulez filtrer.
Pour illustrer mon exemple, voici le script qui affiche tous les jeux dont le nom est « Super Mario Galaxy » :

<xsl:for-each select="test/jeu[nom = 'Super Mario Galaxy']"> <tr> <td><xsl:value-of select="@id"/></td> <td><xsl:value-of select="nom"/></td> <td><xsl:value-of select="type"/></td> <td><xsl:value-of select="prix"/></td> </tr> </xsl:for-each>

Je me suis permis d'utiliser des apostrophes pour délimiter « Super Mario Galaxy », parce que mon fichier est encodé en UTF-8. En ISO, on doit écrire « ' ».

Vous pouvez appliquer des filtres à n'importe quelle balise.

Il existe aussi plusieurs opérateurs de comparaison :

Égal

Non égal

Supérieur

> (>)

Supérieur ou égal

>= (>=)

Inférieur

< (<)

Inférieur ou égal

<= (<=)

Bien entendu, les opérateurs de supériorité ou d'infériorité ne s'appliquent qu'à des nombres.

Il est également possible de mettre plusieurs filtres en même temps. Pour cela, placez or (« ou ») ou and (« et ») entre les conditions.

Vous ne pouvez pas mélanger les deux !

Régions conditionnelles

Il est possible, grâce à une nouvelle balise XSL, de n'afficher une zone que si une condition est remplie.

Voici la balise en question :

<xsl:if test=""> </xsl:if>

Par exemple, le code suivant affichera « J'ai Mario Sokoban » mais pas « J'ai Metroid Prime », sauf si vous l'ajoutez dans le fichier XML.

<xsl:for-each select="test/jeu"> <xsl:if test="nom = 'Mario Sokoban'"> <p>J'ai Mario Sokoban !</p> </xsl:if> <xsl:if test="nom = 'Metroid Prime'"> <p>J'ai Metroid Prime !</p> </xsl:if> </xsl:for-each>

Les multiples conditions

Il existe en XSL une sorte de variante de switch.
Le code de base est celui-ci :

<xsl:choose> <xsl:when test=""> </xsl:when> <xsl:otherwise> </xsl:otherwise> </xsl:choose> <xsl:choose>

ouvre le switch.
Chaque <xsl:when test=""> indique une condition telle que <xsl:if test=""> .
<xsl:otherwise> est l'équivalent du default, c'est-à-dire ce qui est effectué si aucune des conditions n'est vérifiée.

En fait, <xsl:choose> est le mélange d'un switch et d'une cascade de if, elseif, etc.
Les conditions peuvent donc porter sur n'importe quel élément.

Elles offrent beaucoup de possibilités, et les utiliser ne peut être qu'utile.

Commentaires

Les commentaires existent aussi en XSL. Voici la balise en question :

Appeler le centre

180888030

Avez-vous besoin d'un coach de formation?

Il vous aidera à comparer différents cours et à trouver la solution la plus abordable.

Les bases de la mise en forme XML avec XSLT

Prix sur demande

Contact

Les bases de la mise en forme XML avec XSLT

Questions / Réponses

Les Avis

Le programme

Ajoutez des cours similaires
et comparez-les pour mieux choisir.

Les bases de la mise en forme XML avec XSLT

Questions / Réponses

Les Avis

Le programme

Ajoutez des cours similaireset comparez-les pour mieux choisir.

Ajoutez des cours similaires
et comparez-les pour mieux choisir.