Afficher la chaîne XML dans la page HTML

Question

De mon backend, j'obtiens une chaîne contenant des données xml. Quand je l'affiche (maintenant juste avec @ Model.XM) L je vois une belle longue chaîne qui contient les données xml. Est-il possible de formater ceci comme une structure en arbre? Comme avec un plugin jquery ou quelque chose? J'ai essayé quelques google, mais je n'ai pas pu le trouver.

Sur la page est également d'autres données, ce n'est pas seulement les données XML.

Answer 1

Tout ce dont vous avez besoin est une boucle récursive qui transformera les nœuds enfants du document XML en éléments de liste HTML. Essayez quelque chose comme ceci (non testé):

var html = '<ul><li>' + xml.documentElement.nodeName + '</li>'; 
var html += displayTree(xml); 
var html += '</ul>'; 

function displayTree(xml) { 
    var str = ''; 
    if ($(xml).children().length) { 
     str += '<ul>'; 
     $(xml).children().each(function() { 
      str += '<li>' + this.nodeName + '</li>'; 
     }); 
     str += '</ul>'; 
     str += displayTree(xml.childNodes); 
    }); 
    return str; 
} 

Answer 2

Vous pouvez utiliser XSLT.

<xsl:stylesheet version="1.0" 
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> 
<xsl:output omit-xml-declaration="yes" indent="yes"/> 

    <xsl:template match="node()|@*"> 
     <xsl:copy> 
     <xsl:apply-templates select="node()|@*"/> 
     </xsl:copy> 
    </xsl:template> 
</xsl:stylesheet> 

La clé est le

<xsl:output indent="yes"/> 

Si vous appliquez la transformation ci-dessus à votre XML, il sortira bien en retrait. Plus de détails: