XSLT和XML—将图像分组并显示到表中_Xml_Xslt

XSLT和XML—将图像分组并显示到表中

xml xslt

XSLT和XML—将图像分组并显示到表中,xml,xslt,Xml,Xslt,我正在为一位艺术家创建一个网站，我必须根据她的画的类别将她的画分成四个独立的表格。我有一个XML文档，列出了所有的绘画，并进行了相应的组织（这只是一个简短的版本）：城市景观佛罗伦萨小巷 15 X 20英寸。 400 $ 图片/缩略图/城市景观/佛罗伦萨小巷.gif 城市景观纽约的圣诞节 12 X 14英寸。 250 $ 图片/缩略图/城市景观/纽约圣诞节.gif 城市景观纽约，纽约 21 X 29英寸。 495 $ 图片/缩略图/城市景观/纽约！。gif 城市景观 30街站 10 X

我正在为一位艺术家创建一个网站，我必须根据她的画的类别将她的画分成四个独立的表格。我有一个XML文档，列出了所有的绘画，并进行了相应的组织（这只是一个简短的版本）：


城市景观
佛罗伦萨小巷
15 X 20英寸。
400 $
图片/缩略图/城市景观/佛罗伦萨小巷.gif
城市景观
纽约的圣诞节
12 X 14英寸。
250 $
图片/缩略图/城市景观/纽约圣诞节.gif
城市景观
纽约，纽约
21 X 29英寸。
495 $
图片/缩略图/城市景观/纽约！。gif
城市景观
30街站
10 X 11英寸。
出售
图片/缩略图/城市景观/费城1.gif
植物群
鸡蛋花
14 X 20英寸。
图片/缩略图/flora/plumeria.gif
植物群
红色的热带
14 X 20英寸。
出售
图片/缩略图/flora/red leaf.gif
植物群
向日葵
14 X 20英寸。
图片/缩略图/flora/sunflower.gif

这四个类别是：城市景观、植物、静物和动物（我在本代码中遗漏了最后两个），因此当我想要访问图像时，结构是CATALOG/CITYSCAPE/PAINTING或CATALOG/Flora/PAINTING

我有一个显示图像的XSLT样式表，其中每行有四个图像：

    <html>
        <body>

            <table style="margin: 0 auto;" cellspacing="30">
                <xsl:for-each select="CATALOG/CITYSCAPE/PAINTING[position() mod 4 = 1]">
                    <xsl:if test="CATEGORY='Cityscapes'">
                        <tr>
                        <xsl:for-each select=" . | following-sibling::*[position() &lt; 4]">
                            <td valign="bottom" align="center">
                                <img src = "{file}"></img>
                                <p><xsl:value-of select="TITLE"/></p>
                                <p><xsl:value-of select="DIMENSIONS"/></p>
                                <p><xsl:value-of select="PRICE"/></p>
                            </td>
                        </xsl:for-each>
                    </tr>
                    </xsl:if> 
                </xsl:for-each>
            </table>
            <table style="margin: 0 auto;" cellspacing="30" border="1">
                <xsl:for-each select="CATALOG/FLORA/PAINTING[position() mod 4 = 1]">
                    <tr>
                        <xsl:for-each select=" . | following-sibling::*[position() &lt; 4]">
                            <td valign="bottom" align="center">
                                <img src = "{file}" width="120" height="100%"></img>
                                <p><xsl:value-of select="TITLE"/></p>
                                <p><xsl:value-of select="DIMENSIONS"/></p>
                                <p><xsl:value-of select="PRICE"/></p>
                            </td>
                        </xsl:for-each>
                    </tr>
                </xsl:for-each>
            </table>
            <table style="margin: 0 auto;" cellspacing="30" border="1">
                <xsl:for-each select="CATALOG/STILL/PAINTING[position() mod 4 = 1]">
                    <tr>
                        <xsl:for-each select=" . | following-sibling::*[position() &lt; 4]">
                            <td valign="bottom" align="center">
                                <img src = "{file}" width="120" height="100%"></img>
                                <p><xsl:value-of select="TITLE"/></p>
                                <p><xsl:value-of select="DIMENSIONS"/></p>
                                <p><xsl:value-of select="PRICE"/></p>
                            </td>
                        </xsl:for-each>
                    </tr>
                </xsl:for-each>
            </table>
        </body>
    </html>
</xsl:template>    

</xsl:stylesheet>

我已经为每个类别创建了单独的表格，在Chrome中显示城市景观图像时，表格的代码工作得非常好，但它无法显示以下三个类别的图像。然而，这些画的标题、尺寸和价格的所有文字都清楚地显示出来。我一直在寻找这个问题的答案，我觉得这取决于我构建XML文档的方式。我尝试了几种方法来解决这个问题，包括在for each循环中按类别过滤图像

在“CITYSCAPES”循环中，您可以使用以下代码来渲染图像

<img src = "{file}"></img>

请注意，如果需要添加第五个或更多类别，则使用这种方法不必进行任何更改。

这可能是您的问题中的一个输入错误，但您说结构是

CATALOG/CITYSCAPE/PAINTING

，但您的XML具有多元元素名称

CITYSCAPES

。

<img src = "{file}"></img>

<img src = "{file}" width="120" height="100%"></img>

<xsl:template match="CATALOG/*">

<xsl:for-each select="PAINTING[position() mod 4 = 1]">

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
   <xsl:output method="html" indent="yes"/>

   <xsl:template match="/">
      <html>
         <body>
            <xsl:apply-templates/>
         </body>
      </html>
   </xsl:template>

   <xsl:template match="CATALOG/*">
      <table style="margin: 0 auto;" cellspacing="30">
         <xsl:for-each select="PAINTING[position() mod 4 = 1]">
            <tr>
               <xsl:for-each select=" . | following-sibling::*[position() &lt; 4]">
                  <td valign="bottom" align="center">
                     <img src="{file}"/>
                     <p>
                        <xsl:value-of select="TITLE"/>
                     </p>
                     <p>
                        <xsl:value-of select="DIMENSIONS"/>
                     </p>
                     <p>
                        <xsl:value-of select="PRICE"/>
                     </p>
                  </td>
               </xsl:for-each>
            </tr>
         </xsl:for-each>
      </table>
   </xsl:template>
</xsl:stylesheet>