2016-08-09 48 views
0

Ich habe Daten für Bilder wie diese:XSLT-Gruppierung für HTML

<data> 
    <image> 
     <type>preview</type> 
     <pageNr>1</pageNr> 
     <url>5981-211.png</url> 
    </image> 
    <image> 
     <type>thumbnail</type> 
     <pageNr>1</pageNr> 
     <url>5549a_aldj_thumb.png</url> 
    </image> 
    <image> 
     <type>big thumb</type> 
     <url>47697-4921.png</url> 
    </image> 
    <image> 
     <type>preview</type> 
     <pageNr>2</pageNr> 
     <url>491-d91.png</url> 
    </image> 
    <image> 
    <type>thumbnail</type> 
     <pageNr>2</pageNr> 
     <url>491-d91_thumb.png</url> 
    </image> 
</data> 

Und ich möchte die folgende HTML-Ausgabe erstellen:

<a href="5981-211.png" title="1"> 
    <img src="5549a_aldj_thumb.png" /> 
</a> 
<a href="491-d91.png" title="2"> 
    <img src="491-d91_thumb.png" /> 
</a> 

Für jeden preview ein thumbnail mit gleich ist pageNr .

Wie kann ich die Daten gruppieren und die in das <a> Tag verschachteln?

Antwort

1

Dies kann mit der Verwendung eines Schlüssels erreicht werden, um die „Thumbnail“ Bilder zum Nachschlagen

<xsl:key name="thumb" match="image[type='thumbnail']" use="pageNr" /> 

Sie würden indem Sie die „Vorschau“ Elemente

<xsl:apply-templates select="image[type='preview']"/> 

Und in der Vorlage beginnen Wenn dies übereinstimmt, würden Sie das Tag a erstellen und dann die untergeordneten Elemente "Miniatur" mit dem Schlüssel

<a href="{url}" title="{pageNr}"> 
    <xsl:apply-templates select="key('thumb', pageNr)" /> 
</a> 
auswählen

Und in der Vorlage, die die Thumbnails übereinstimmt, würden Sie die img Tag wie so erstellen:

<img src="{url}" /> 

Versuchen Sie, diese XSLT

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

    <xsl:key name="thumb" match="image[type='thumbnail']" use="pageNr" /> 

    <xsl:template match="/data"> 
     <body> 
     <xsl:apply-templates select="image[type='preview']"/> 
     </body> 
    </xsl:template> 

    <xsl:template match="image[type='preview']"> 
     <a href="{url}" title="{pageNr}"> 
      <xsl:apply-templates select="key('thumb', pageNr)" /> 
     </a> 
    </xsl:template> 

    <xsl:template match="image[type='thumbnail']"> 
     <img src="{url}" /> 
    </xsl:template> 
</xsl:stylesheet>