2012-05-08 5 views
1

Je souhaite afficher les données XML dans DIV. Mon code XML est ci-dessous:Comment afficher les données XML dans DIV

<note> 
    <to>Tove</to> 
    <from>Jani</from> 
    <heading>Reminder</heading> 
    <body>Don’t forget me this weekend!</body> 
</note> 

Je veux qu'il soit affiché exactement comme il est dans une div, avec toutes les étiquettes d'espacement de ligne et XML exactement comme ils sont.

Est-ce possible?

+0

que l'on est le langage côté serveur? et quel est votre scénario? s'il vous plaît laissez-nous savoir afin que nous puissions vous aider. – swati

+2

Check it out: [http://stackoverflow.com/questions/7004633/open-xml-and-display-data-in-div] – swati

+0

je dois faire du côté client – cgvector

Répondre

2

Je suppose que votre problème est que vous essayez de placer le code XML dans le DIV, et le navigateur essaie d'interpréter les balises XML comme des balises HTML? Vous pouvez éviter cela en remplaçant tous les "<" et ">" dans le code XML avec les caractères spéciaux HTML & gt; et & lt.

2

À côté des < et > Vous devez également remplacer les guillemets doubles et les esperluettes.

function htmlEntities(str) { 
    return String(str).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;'); 
} 

Cela fera l'affaire.

+0

Comment pouvez-vous préserver les espaces? – tree

+0

Cela faisait longtemps, mais je me souviens de les avoir remplacés. Remplacer/r/n avec br et/t avec des espaces. J'ai un nouveau code pour montrer xml dans div cependant. Je ne peux pas y accéder. Quand j'essaie la réponse – Timmetje

+0

En les remplaçant, je fais une coupure de ligne, alors j'essayais de comprendre comment garder tout ce qui était nécessaire pour que la div soit respectée. – tree

0

J'ai trouvé un moyen de garder le format original xml visuellement pour maintenir l'espacement blanc & sauts de ligne tout en affichant les balises xml. Cela devrait améliorer les réponses données ici. J'ai utilisé la méthode de Tim Dev pour remplacer les chaînes de caractères xml par des éléments visibles du texte html. Ensuite, avec une classe que j'ai trouvé par Vadim Kiryukhin appelé vkBeautify le xml pré-traité apparaît comme il se doit dans une zone de texte cible.

 function addXMLToTextArea(xml) { 
      var replaceArgs = htmlEntities(xml); 
      document.getElementById('viewXML').value=vkbeautify.xml(xml, 4); 
     } 

     function htmlEntities(str) { 
      return String(str).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;'); 
     } 
0

Selon la cross-browser vous devez être, il pourrait suffire en utilisant la balise <xmp> ou <pre><code> balises avec une chaîne représentant votre XML entre guillemets:

<div> 
    <xmp> 
    <Status> 
    <Code>0</Code> 
    <Text>Success</Text> 
    </Status> 
    </xmp> 
</div> 

<div> 
    <pre><code> 
    "<Status> 
    <Code>0</Code> 
    <Text>Success</Text> 
    </Status>" 
    </pre></code> 
</div> 
Questions connexes