Affichage des fichiers XML

Afficher des fichiers XML


XML cours tutorial

Les fichiers XML peuvent être affichées dans tous les navigateurs principaux.
Mais les fichiers XML ne s’affichent pas comme des pages HTML.
Exemple : teste.xml

Sélectionner le code

  <?xml version="1.0" encoding="UTF-8"?>
  <listelivres>
    <livre categorie="COOKING">
      <titre lang="en">Everyday Italian</titre>
      <auteur>Giada De Laurentiis</auteur>
      <année>2005</année>
      <prix>30.00</prix>
    </livre>
    <livre categorie="CHILDREN">
      <titre lang="en">Harry Potter</titre>
      <auteur>J K. Rowling</auteur>
      <année>2005</année>
      <prix>29.99</prix>
    </livre>
    <livre categorie="WEB">
      <titre lang="en">Learning XML</titre>
      <auteur>Erik T. Ray</auteur>
      <année>2003</année>
      <prix>39.95</prix>
    </livre>
  </listelivres>

 

Editez cet exemple dans votre éditeur préféré et affichez le dans votre explorateur.
Le fichier XML s’affichera avec l’élément racine et les éléments enfants en couleur.
et selon l'explorateur:

Avec le signe plus (+) ou le signe moins (-) à gauche des éléments, vous pouvez développer ou réduire la structure de l’arbre des l'éléments.
Pour afficher la source XML brute comme vous l’avez écrit, sélectionnez « Afficher la Page Source » ou « Afficher la Source » dans le menu du navigateur.
Une ligne est affiché en haut de la page comme suit :

Aucune information de style ne semble associée à ce fichier XML. L'arbre du document est affiché ci-dessous.

 Affichage d'un fichier XML non valide

Si un fichier XML erroné est ouvert, le navigateur signale l'erreur.
Pour voir ce qui sera affiché, faite une erreur dans le code de l’exemple ci-dessus (oublier par exemple la balise fermante d’un élément ou les apostrophes au tour d’un attribut ) et afficher le le fichier.

Pourquoi cet affichage pour le fichier XML ?

Parce que le document XML ne contient pas  d'information sur la maniére d'afficher les données.
Étant donné que les balises XML sont « inventés » par l'auteur du document XML, les navigateurs ne savent pas si une balise comme <table> décrit un tableau HTML ou une table à manger.
Sans information sur la façon d'afficher les données, les navigateurs afficheront juste le document XML comme il est.
Dans les prochains chapitres, nous verrons les différentes solutions pour résoudre ce problème d'affichage, à l'aide de CSS, XSLT et JavaScript.

Affichage XML avec CSS

Avec CSS (Cascading Style Sheets), vous pouvez ajouter des informations d'affichage dans un document XML.
Voici un exemple de comment utilisant une feuille de style CSS pour mettre en forme un document XML :
Exemple :

Sélectionner le code

  <?xml version="1.0" encoding="UTF-8"?>
  <?xml-stylesheet type="text/css" href="livres.css"?>
  <listelivres>
    <livre categorie="COOKING">
      <titre lang="en">Everyday Italian</titre>
      <auteur>Giada De Laurentiis</auteur>
      <année>2005</année>
      <prix>30.00</prix>
    </livre>
    <livre categorie="CHILDREN">
      <titre lang="en">Harry Potter</titre>
      <auteur>J K. Rowling</auteur>
      <année>2005</année>
      <prix>29.99</prix>
    </livre>
    <livre categorie="WEB">
      <titre lang="en">Learning XML</titre>
      <auteur>Erik T. Ray</auteur>
      <année>2003</année>
      <prix>39.95</prix>
    </livre>
  </listelivres>

 

La deuxième ligne relie le fichier XML au  fichier CSS (livres.css ) que voici le code css , enregisstrez le dans le même dossier que le fichier XML :
Exemple :

Sélectionner le code

 listelivres
{
background-color: #ffffff;
width: 100%;
}
livre
{
display: block;
margin-bottom: 30pt;
margin-left: 0;
}
titre
{
color: #FF0000;
font-size: 20pt;
}
auteur
{
color: #0000FF;
font-size: 20pt;
}
année,prix
{
display: block;
color: #000000;
margin-left: 20pt;
}

 

Affichez le fichier XML pour voir le résultat.
La mise en forme XML avec CSS n'est pas la méthode la plus courante.
W3C recommande  XSLT. Que nous allons Voir dans  le chapitre suivant.




Cours precedent:
cours precedent  Comment on utilise XML
    Sommaire de :
Le langage XML
 Cours suivant:
XSL tutoriel   cours suivant
Par carabde 10 mai 2014