使用xslt将调色板文件转换为html内容

时间:2017-04-03 08:09:10

标签: html xml xslt

我想转换这种类型的XML调色板文件:

<?xml version="1.0"?>
<?xml-stylesheet href="Palette.xsl" type="text/xsl"?>
<Palette Name="MyPalette">
  <PaletteEntry Color="#D0427B" Color2="#D0427B" />
  <PaletteEntry Color="#D55588" Color2="#D55588" />
  <PaletteEntry Color="#DA6895" Color2="#DA6895" />
</Palette>

使用此XSL转换:

<?xml version="1.0" ?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

<xsl:template match="Palette">
<html>
    <head>
        <title>Palette {@Name}</title>
        <!--link rel="stylesheet" href="Palette.css" type="text/css"/-->
    </head>
    <body>
        <div class="palette">
            <xsl:apply-templates/>
        </div>
    </body>
</html>
</xsl:template>

<xsl:template match="PaletteEntry">
    <div class="palette-entry" style="width:40px;height:40px; margin:2px; float:left; background-color: {@Color}; border: 2px solid {@Color2};">
        <xsl:apply-templates select="@*"/>
    </div>
</xsl:template>

<xsl:template match="@Color">
    <xsl:copy-of select="."/>
</xsl:template>

<xsl:template match="@Color2">
    <xsl:copy-of select="."/>
</xsl:template>

</xsl:stylesheet>

输出中的问题是,颜色属性在属性中时会很好地呈现,但不会在内容中进行翻译。这是HTML输出:

<html>

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <title>Palette {@Name}</title>
</head>

<body>
  <div class="palette">
    <div class="palette-entry" style="width:40px;height:40px; margin:2px; float:left; background-color: #495359; border: 2px solid #495359;" color="495359" color2="#495359"></div>
    <div class="palette-entry" style="width:40px;height:40px; margin:2px; float:left; background-color: #5B646A; border: 2px solid #5B646A;" color="5B646A" color2="#5B646A"></div>
  </div>
</body>

</html>

如何将颜色值复制到内容?

预期产出:

<html>

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <title>Palette "MyPalette"</title>
</head>

<body>
  <div class="palette">
    <div class="palette-entry" style="width:40px;height:40px; margin:2px; float:left; background-color: #495359; border: 2px solid #495359;">#495359<br/>#495359</div>
    <div class="palette-entry" style="width:40px;height:40px; margin:2px; float:left; background-color: #5B646A; border: 2px solid #5B646A;">#5B646A<br/>#5B646A</div>
  </div>
</body>

</html>

1 个答案:

答案 0 :(得分:1)

ColorColor2是XML中的属性,因此使用xsl:copy将在结果树中创建一个属性(尽管在Color的情况下您正在使用xsl:attribute首先创建一个新属性。

您实际上只想输出属性的值,因此请改用xsl:value-of

<xsl:template match="@Color">
    <xsl:value-of select="." />
    <br />
</xsl:template>

<xsl:template match="@Color2">
    <xsl:value-of select="." />
</xsl:template>