Utiliser une feuille de style XSL est l'alternative la plus puissante pour manipuler les données :
- Toute la puissance de la présentation HTML
- Toutes les fonctionnalités du XSL (Tri, conditions, boucles ...)
- Le dynamisme grâce au javascript
Pour afficher l'association d'un document XML avec une feuille de style XSL (Transformation XSL), plusieurs
méthodes existent :
- La première est de spécifier dans le fichier XML la feuille de style qui lui sera appliquée,
juste après la déclaration (en 2nde ligne). En ouvrant le fichier XML, la
transformation se fera automatiquement :
<?xml version="1.0" encoding="ISO-8859-1"?>
<?xml-stylesheet type="text/xsl" href="MonFichierXSL.xsl"?>
<noeud_racine>
...
</noeud_racine>
- La seconde est d'utiliser le javascript pour effectuer la transformation et
afficher le résultat dans un élément html (classiquement une div). Nous utilisons
ici les ActiveX limitant cette méthode uniquement à Internet Explorer :
Dans l'en-tête html, une fonction javascript s'occupe du chargement des documents :
var source;
var style;
function Load(FichierXML,FichierXSL){
//----- INITIALISATION DES OBJETS XML / XSL
source = new ActiveXObject("Microsoft.XMLDOM");
style = new ActiveXObject("Microsoft.XMLDOM");
source.async = false;
style.async = false;
//----- CHARGEMENT DES SOURCES
source.load(FichierXML);
style.load(FichierXSL);
}
Dans la partie body, on déclare l'élément html qui affichera les données :
<div id="idResultat"></div>
Enfin on lance la fonction de transformation des documents :
<script language="JavaScript">
// Affichage de la transformation dans la div
Load("Objet_Array.xml","Objet_Array.xsl");
document.getElementById("idResultat").innerHTML = source.transformNode(style);
</script>
- Une troisième solution alternative est l'utilisation des ilôts xml (tag html non officiel <xml>) qui
sont alors accessible dans la page html :
Le code html est du type :
<html>
<head>
... en tête ...
</head>
<body>
<xml id="MonIlotXML" src="MonFichierXML.xml"></xml>
<table border="1" datasrc="#MonIlotXML">
<tr>
<td><span datafld="NOM"></span></td>
<td><span datafld="PRENOM"></span></td>
</tr>
</table>
... Code ...
</body>
</html>
Avec un fichier XML ayant comme structure :
<?xml version="1.0" encoding="ISO-8859-1"?>
<?xml-stylesheet type="text/xsl" href="MonFichierXSL.xsl"?>
<liste_contacts>
<contact>
<nom>Smith</nom>
<prenom>John</prenom>
</contact>
...
</liste_contacts>
» Afficher l'exemple Ilôt XML
|