如何在HTML代码标记内显示缩进的XML

Question

我想在<code></code>里面的html页面中显示缩进的XML我从javascript函数获取XML

new XMLSerializer()).serializeToString(newXMLDoc)

这给了我无意的XML字符串。

我能想到的一种方法是使用<ul>和<li>

但有更好的方法吗？

在这种情况下，XSLT可以帮助我吗（抱歉，我对XSLT了解不多）。如果是，我需要在html文档中或在我附加到<code></code>的xmlString中附加XSLT样式表。 <code></code>标签。

它只是一个客户端应用程序我不能在服务器端做任何事情。

更新：我也用<替换xmlString中的<和> 和> 我还能使用XSLT吗？

即使在应用了Dimitre Novatchev给出的XSLT后，我也没有得到缩进文本，虽然我可以看到XML在使用SAXON解析器kernow应用XSLT时缩进但是当我在我的javascript代码中执行它时我得到了相同的缩进码。

    //var xslt contains the XSLT provided by Dimitre Novatchev as string
    //var XMLDoc is the XMLDocument object to be transformed
    xsltProcessor=new XSLTProcessor();
    xsltProcessor.importStylesheet(xsl);
    newXMLDoc = xsltProcessor.transformToDocument(xml,document);
    //This is how I am converting the transformed XML to string 
    return (new XMLSerializer()).serializeToString(newXMLDoc)

Answer 1

我建议您使用服务器端代码执行此操作，并将HTML格式的XML发送到您的客户端。 是的，XSLT可以帮到你。 但是您应该在服务器上对 XML进行HTML编码 。

但请注意，如果要从文档中删除\\n标记（换行符）和其他空格字符（如空格，制表符等），则需要搜索客户端文档格式化程序或其他内容像那样。 写这样的东西绝不是一件容易的事。

您还可以使用语法高亮显示器来处理XML。 这里可以找到一个很好的例子。 然后你可以简单地使用：

<pre class='brush: xml;'>
   // XML goes here.
</pre>

Answer 2

您可以分两步完成此操作：

首先，只使用标识转换和<xsl:output indent="yes"/>指令处理XML文档 ：

<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>

在任何XML文档 （例如此文档 ） 上应用此转换时 ：

<root><node/></root>

大多数XSLT处理器 （.NET XslCompiledTransform，Saxon 6.5.4和Saxon 9.0.0.2，AltovaXML） 产生想要的结果 ：

<root>
  <node />
</root>

第二个步骤是为执行一个字符串替换该结果操作，使得任何<字符被替换为< 串。

如果你想要一个更高级的显示器，看看XPath Visualizer如何使用XSLT做到这一点 。