使用 xsl 将单独的图像链接到单独的 html 页面

Question

我正忙于一个 XML 有一群乐队的大学项目。我目前已经让我的 XSL 输出多个 HTML 页面作为每个波段的 "profile page"（所以每个波段都在一个单独的 HTML 页面上），链接相互链接.现在，我想在相应的 html 页面上添加乐队的图像。这可能吗？

这是 XML 中一位艺术家的示例：

<lineup>
  <artist id="101">
    <name>Jeremey Loops</name>
    <genres>
      <genre>Acoustic</genre>
    </genres>
    <writeup>
      Jeremy Loops aint no traditional 'band', creating music on the spot with     that there loopdaloop pedal. Various artists also join him for free jam sessions     & the music they create is all original. it'll definitely make ya dance like a hick!
    </writeup>
    <gig>
      <day>FRIDAY</day>
      <time>
        <starts>12:00</starts>
        <ends>14:00</ends>
      </time>
    </gig>
  </artist>
</lineup>

这是我用 XSL 尝试过的方法，但只发现图像显示在所有页面上，图像的两面都写有 'true' 和 'false'。

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

<xsl:output method="html" indent="yes" name="html"/>

<xsl:template match="/">
    <xsl:apply-templates select="lineup"/>
</xsl:template>

<xsl:template match="lineup">
   <xsl:apply-templates select="artist"/>
</xsl:template>

<xsl:template match="artist">

<xsl:variable name="filename" select="concat('bands/',name,'.html')" />
<xsl:value-of select="$filename" />  
<xsl:result-document href="{$filename}" format="html">
    <html>
    <head>
        <link rel="stylesheet" type="text/css" href="../sass/test.css" />
        <title>
            <!-- TITLE OF PAGE -->
            Band - <xsl:value-of select="name"/>
        </title>
    </head>
    <body>
<!-- Adding Image -->
<div class="images">
                <xsl:value-of select="name = 'Jeremey Loops'"/>
                    <img src="images/jeremey_loops.png" alt="Jeremey Loops standing with guitar" height="350px"/>
            </div>

<!-- LINKS TO BAND PAGES -->
        <div class="box links">
            <xsl:variable name="current" select="@id" />
            <xsl:for-each select="/lineup/artist" >
                <a href="{name}.html">
                    <xsl:value-of select="name"/> | 
                </a>
            </xsl:for-each>
        </div>
    </body>
    </html>
</xsl:result-document>

</xsl:template>
</xsl:stylesheet>

所以我只想 'Jeremey Loops' 图片显示在他的页面上而不是其他艺术家的页面上，其余的也是如此。我应该为每个艺术家添加一个过滤器吗？

Answer 1

您可以使用将艺术家转换为图像的功能 url。

假设您有一个目录 "images"，其中包含文件名格式遵循模式 {artist_id}_{lowercase_underscored_name}.png:

的图像

101_jeremy_loops.png
32_phil_beats.png
420_snoop_dogg.png
...

然后您可以编写一个 XSLT 函数（如果您坚持使用 XSLT 1.0，则可以编写一个类似的命名模板）从给定参数创建文件路径：

<xsl:stylesheet version="2.0" 
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    xmlns:foo="http://whatever">

<!-- foo:getImgUrl("64","Phil Beats") -> "64_phil_beats.png" -->
<xsl:function name="foo:getImgUrl">
    <xsl:param name="artist_id"/>
    <xsl:param name="artist_name"/>

    <xsl:value-of select="$artist_id"/>
    <xsl:text>_</xsl:text>

    <!-- returns lowercased artist name, replaces all non-alphanumerical
         characters with underscores. -->
    <xsl:value-of select="replace(lower-case($artist_name),'[^a-z0-9]','_')"/>

    <xsl:text>.png</xsl:text>
</xsl:function>

...

像这样在样式表中使用它：

...
<img>
    <xsl:attriute name="src">
        <xsl:value-of select="foo:getImgUrl(@id, name/text())"/>
    </xsl:attribute>
</img>
...

使用 xsl 将单独的图像链接到单独的 html 页面

Linking separate images into separate html pages using xsl

html

xml

xslt