XML - 将图像放入.xsl

时间:2013-01-28 15:09:27

标签: css xml image xslt xslt-1.0

我有一个用XML和XLST制作的“博客”。

这是博客的格式:

<post id="1" category="Miscellaneous">
<ptitle>MiG-21</ptitle>
<psubtitle>Mikoyan-Gurevich MiG-21</psubtitle> 
<image></image>
<author> Brian Livori </author> 
<date> 11/10/2012 </date>
<par> The Mikoyan-Gurevich MiG-21 (Russian: Микоян и Гуревич МиГ-21; NATO reporting name: Fishbed) is a supersonic jet fighter aircraft, designed by the Mikoyan-Gurevich Design Bureau in the Soviet Union. It was popularly nicknamed "balalaika", from the aircraft's planform-view resemblance to the Russian stringed musical instrument or ołówek (English: pencil) by Polish pilots due to the shape of its fuselage.[2]

Early versions are considered second-generation jet fighters, while later versions are considered to be third-generation jet fighters. Some 50 countries over four continents have flown the MiG-21, and it still serves many nations a half-century after its maiden flight. The fighter made aviation records. At least by name, it is the most-produced supersonic jet aircraft in aviation history and the most-produced combat aircraft since the Korean War, and it had the longest production run of a combat aircraft (1959 to 1985 over all variants).
</par>
<source>http://en.wikipedia.org/wiki/Mikoyan-Gurevich_MiG-21</source>
<comments>dsgsdg</comments>
</post>

<post id="2" category="Miscellaneous">
<ptitle>MiG-21</ptitle>
<psubtitle>Mikoyan-Gurevich MiG-21</psubtitle> 
<image></image>
<author> Brian Livori </author> 
<date> 11/10/2012 </date>
<par> The Mikoyan-Gurevich MiG-21 (Russian: Микоян и Гуревич МиГ-21; NATO reporting name: Fishbed) is a supersonic jet fighter aircraft, designed by the Mikoyan-Gurevich Design Bureau in the Soviet Union. It was popularly nicknamed "balalaika", from the aircraft's planform-view resemblance to the Russian stringed musical instrument or ołówek (English: pencil) by Polish pilots due to the shape of its fuselage.[2]

Early versions are considered second-generation jet fighters, while later versions are considered to be third-generation jet fighters. Some 50 countries over four continents have flown the MiG-21, and it still serves many nations a half-century after its maiden flight. The fighter made aviation records. At least by name, it is the most-produced supersonic jet aircraft in aviation history and the most-produced combat aircraft since the Korean War, and it had the longest production run of a combat aircraft (1959 to 1985 over all variants).
</par>
<source>http://en.wikipedia.org/wiki/Mikoyan-Gurevich_MiG-21</source>
<comments>dsgsdg</comments>
</post>

我想为每篇博文插入图片。

我该怎么做?

这是我的.xls文件:

<?xml version="1.0" encoding="ISO-8859-1"?>

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

<xsl:output method="html"/>

<xsl:template match ="/">

    <html>
    <body>
        <table align="center" >
            <tr bgcolor="C77838">
                <th>Brian's Blog </th>
                <th>About</th>
                <th>Contact</th>
            </tr>
        </table>

        <table align="center"  bgcolor="1D6135">

        <tr align="center">

        <xsl:element name="img" >
          <xsl:attribute name="border">0</xsl:attribute>
          <xsl:attribute name="src">images/banner.jpg</xsl:attribute>
          <xsl:attribute name="alt">Banner</xsl:attribute>
         </xsl:element>

        </tr>

        <tr align="center">
        <h1>JET FIGHTERS</h1>
        </tr>

        </table>
        <br></br><br></br>

        <table >
            <td width="10%" bgcolor="white"></td>

            <td bgcolor="CC9933">
            <xsl:for-each select="blog/post">
            <tr bgcolor="FFFF99" ><td><xsl:value-of select="ptitle"/></td></tr>
            <tr bgcolor="FFFFCC"><td><xsl:value-of select="psubtitle"/></td></tr><br></br><br></br>
            <tr bgcolor="FFFFCC"><td><xsl:value-of select="image"/></td></tr>

            <tr><td><xsl:value-of select="par"/></td></tr><br></br><br></br>
            <tr bgcolor="D6D6B2"><td>Source: <xsl:value-of select="source"/></td></tr>

            <br></br><tr bgcolor="FFFFCC">Posted on: <xsl:value-of select="date"/> by <xsl:value-of select="author"/></tr>
            <br></br><tr bgcolor="FFFFCD">Comments: <xsl:value-of select="comments"/> by <xsl:value-of select="comments"/></tr>
            <hr color="white"></hr>
            </xsl:for-each>
            </td>

            <td width="10%" bgcolor="white"></td>
        </table>
    </body>
    </html>

</xsl:template>

<xsl:template match="list">
   Images are element contents, apply a template to all image elements:
   <xsl:apply-templates select="image"/>
   Images are attribute values of an element, we do it differently:
   <xsl:apply-templates select="image3"/>
</xsl:template>

<xsl:template match="image1">
                <p> <img src="{@source}"/><br/><xsl:value-of select="."/> </p>
</xsl:template>

</xsl:stylesheet>

1 个答案:

答案 0 :(得分:0)

假设图片的网址将包含在<image>元素中,并且<images>空白的图片应该省略,我相信这就是您要完成的工作。如果没有,请澄清你的问题:

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

  <xsl:output method="html"/>

  <xsl:template match ="/">

    <html>
      <body>
        <table align="center" >
          <tr bgcolor="C77838">
            <th>Brian's Blog </th>
            <th>About</th>
            <th>Contact</th>
          </tr>
        </table>

        <table align="center"  bgcolor="1D6135">

          <tr align="center">
            <td>
              <img border="0" src="images/banner.jpg" alt="Banner" />
            </td>
          </tr>

          <tr align="center">
            <td>
              <h1>JET FIGHTERS</h1>
            </td>
          </tr>

        </table>
        <br />
        <br />

        <table >
          <tr>
            <td width="10%" bgcolor="white"></td>

            <td bgcolor="CC9933">
              <xsl:apply-templates select="blog/post" />
            </td>

            <td width="10%" bgcolor="white"></td>
          </tr>
        </table>
      </body>
    </html>

  </xsl:template>

  <xsl:template match="post">
    <table>
      <tr bgcolor="FFFF99" >
        <td>
          <xsl:value-of select="ptitle"/>
        </td>
      </tr>
      <tr bgcolor="FFFFCC">
        <td>
          <xsl:value-of select="psubtitle"/>
        </td>
      </tr>
      <br></br>
      <br></br>
      <xsl:if test="normalize-space(image)">
        <tr bgcolor="FFFFCC">
          <td>
            <xsl:apply-templates select="image"/>
          </td>
        </tr>
      </xsl:if>
      <tr>
        <td>
          <xsl:value-of select="par"/>
        </td>
      </tr>
      <br />
      <br />
      <tr bgcolor="D6D6B2">
        <td>
          Source: <xsl:value-of select="source"/>
        </td>
      </tr>

      <br></br>
      <tr bgcolor="FFFFCC">
        <td>
          Posted on: <xsl:value-of select="date"/> by <xsl:value-of select="author"/>
        </td>
      </tr>
      <br></br>
      <tr bgcolor="FFFFCD">
        <td>
          Comments: <xsl:value-of select="comments"/> by <xsl:value-of select="comments"/>
        </td>
      </tr>
      <hr color="white" />
    </table>
  </xsl:template>

  <xsl:template match="image">
    <p>
      <img src="{.}"/>
      <br/>
      <xsl:value-of select="."/>
    </p>
  </xsl:template>

</xsl:stylesheet>

您的HTML存在很多问题。我清理了尽可能多的东西,但还有很多东西需要修复。您不应该使用表格进行布局,但如果您必须这样做,那么至少,您不应该在表格元素正下方<br/ ><hr /> <td> s必须直接位于<tr> s下,<tr> s必须位于<table> s的正下方。