Introduction détaillée à l'exemple de code pour convertir des données XML en HTML

Utilisez une simple feuille de style XSL pour convertir les données XML en HTML. À mesure que la spécification XML continue d'évoluer, il semble nécessaire de répondre aux besoins de chacun dans la nouvelle version ; supposons que vous disposiez de données XML qui représentent le contenu d'une page et que vous souhaitiez maintenant convertir son contenu en mise en page. Voici le XML que vous souhaitez convertir :

<?xmlversion=&#39;1.0&#39;?> 
<?xml-stylesheettype="text/xsl"href="article.xsl"?> 
<xml> 
<folders> 
<folder> 
<text>Folder1</text> 
<files> 
<file> 
<text>File1</text> 
<fields> 
<field> 
<data> 
<type>string</type> 
<length>50</length> 
<value>somedata</value> 
</data> 
</field> 
</fields> 
</file> 
</files> 
</folder> 
</folders> 
</xml>

Ce contenu représente un ensemble de dossiers, fichiers et champs. Chaque dossier contient des fichiers , et chaque fichier contient des champs pour les données d'entrée. Chaque dossier du groupe de dossiers sera représenté par un élément TR et un élément TD dans la première ligne d'un TABLE. Chaque fichier du groupe de fichiers sera représenté comme un élément TR et un élément TD sur la première ligne d'un élément TABLE imbriqué dans l'élément TR du dossier. Chaque domaine du groupe de domaines apparaîtra comme une INPUT dans le fichier associé.
Ce qui suit est le XSL utilisé pour cette transformation :

<?xmlversion="1.0"?> 
<xsl:stylesheet 
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"version="1.0" 
xmlns:msxsl="urn:schemas-microsoft-com:xslt" 
xmlns:fn=http://www.aaa.com/aaa> 
<xsl:outputmethod="html"/> 
<msxsl:scriptlanguage="JScript"implements-prefix="fn"> 
functiongetElementCount(nodelist,what){ 
varrtrn=0; 
rtrn=nodelist[0].parentNode.selectNodes(what).length; 
return(rtrn 1);//1isaddedforfillerTD 
} 
</msxsl:script> 
<xsl:templatematch="/"> 
<TABLECELLSPACING="0"CELLPADDING="0" 
WIDTH="100%"BORDER="0"ID="tblRoot"NAME="tblRoot" 
style="table-layout:fixed;"> 
<TR> 
<xsl:for-eachselect="xml/folders/folder"> 
<xsl:elementname="TD"> 
<xsl:attributename="style">width:55px</xsl:attribute> 
<xsl:value-ofselect="text"/> 
</xsl:element> 
</xsl:for-each> 
<TD></TD> 
</TR> 
<xsl:for-eachselect="xml/folders/folder"> 
<TR> 
<xsl:elementname="TD"> 
<xsl:attributename="colspan"> 
<xsl:value-ofselect="fn:getElementCount(.,&#39;folder&#39;)"/> 
</xsl:attribute> 

<TABLECELLSPACING="0"CELLPADDING="0" 
WIDTH="100%"BORDER="0"style="table-layout:fixed;"> 
<TR> 
<xsl:for-eachselect="files/file"> 
<xsl:elementname="TD"> 
<xsl:attributename="style">width:55px;</xsl:attribute> 
<xsl:value-ofselect="text"/> 
</xsl:element> 
</xsl:for-each> 
<TD></TD> 
</TR> 
<xsl:for-eachselect="files/file"> 
<TR> 
<xsl:elementname="TD"> 
<xsl:attributename="colspan"> 
<xsl:value-ofselect="fn:getElementCount(.,&#39;file&#39;)"/> 
</xsl:attribute> 
<xsl:for-eachselect="fields/field"> 
<xsl:elementname="INPUT"> 
<xsl:attributename="type">text</xsl:attribute> 
<xsl:attributename="maxlength"> 
<xsl:value-ofselect="data/length"/> 
</xsl:attribute> 
<xsl:attributename="value"> 
<xsl:value-ofselect="data/value"/> 
</xsl:attribute> 
</xsl:element><BR/> 
</xsl:for-each> 
</xsl:element> 
</TR> 
</xsl:for-each> 
</TABLE> 
</xsl:element> 
</TR> 
</xsl:for-each> 
</TABLE> 
</xsl:template> 
</xsl:stylesheet>

Dans la balise stylesheet, plusieurs espaces de noms sont définis, y compris la définition de toutes les transformations xsl L'espace de noms XML de la balise. Espace de noms msxml qui nous permet de créer desfonctions utilisateur pouvant être utilisées dans les feuilles de style. Utilisez ceci pour obtenir tous les éléments enfants afin d'obtenir un ensemble de attributs COLSPAN pour une balise TD. L'espace de noms fn utilisé pour rejoindre un ensemble de fonctions définies par l'utilisateur créées par l'élément msxml:script.
Ensuite, nous créons la TABLE externe et le premier TR. Dans le TR, créez un TD pour chaque dossier spécifié dans le XML. La balise xsl:element est utilisée car elle permet d'ajouter des attributs personnalisés ou d'exécuter une fonction pour définir une propriété pour l'attribut COLSPAN dans un autre élément TD.
Après avoir créé le TD requis pour chaque dossier, commencez à créer un TR pour chaque dossier. Ajoutez un seul TD à ce TR, mais définissez son attribut COLSPAN égal au nombre de balises de dossier dans le groupe de dossiers plus une. L'extra est utilisé pour remplir les espaces dans une TABLE à disposition fixe.
Pour obtenir COLSPAN, passez le contexte courant (précisé ici par ".") et le nom du nœud à calculer. Dans la fonction, obtenez le contexte actuel, paraentNode et le nombre de nœuds spécifiés dans XPath requête . La fonction renvoie ensuite ce montant plus un pour remplir le TD.
Avec ce TD, intégrez-y une autre TABLE, qui contient chaque fichier du groupe de fichiers. A partir de ce moment, le processus est le même que pour une conversion TABLE externe. La dernière étape consiste à ajouter les champs dans chaque fichier.
Une fois la présentation générale terminée, vous pouvez commencer ajouter des fonctionnalités de l'interface utilisateur, telles que masquer d'autres dossiers et lignes de fichiers jusqu'à ce que l'utilisateur clique sur l'onglet correspondant. Cette fonctionnalité peut être obtenue en écrivant un script qui prend en charge cette fonctionnalité en ajoutant un élément onclick xsl:attribute aux éléments TD du dossier et du fichier, puis en définissant sa valeur sur le nom de la fonction de script. Enfin, une fois la fonctionnalité commune terminée, vous pouvez ajouter la classe xsl:attributes et ajouter les noms de classe associés dans STYLE ou CSS pour obtenir l'apparence souhaitée.
Cet exemple crée une base pour la
vue File-Folder-Field utilisée dans le déploiement de solutions de données Web. Visitez MSDN pour en savoir plus sur la spécification XML de Microsoft.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!