如何使用XSL代码在HTML表格中显示图像？

I created an XSL style sheet for my XML web service. I have image link that output by database on my HTML. But my XSL only display the link but not the image that link contain. I want to display direct image inside the HTML table using XSL.

我为XML Web服务创建了一个XSL样式表。我有我的HTML上的数据库输出的图像链接。但我的XSL只显示链接,但不显示链接包含的图像。我想使用XSL在HTML表格中显示直接图像。

This is my XSL code

这是我的XSL代码

    <?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
  <html>
  <body>
    <h2>Birdcatch XSLT</h2>
    <table border="1">
      <tr bgcolor="#9acd32">
        <th>id</th>
        <th>Species</th>
        <th width="50%">About_bird</th>
        <th>Date_added</th>
        <th>Address</th>
        <th>Age</th>
        <th>Sex</th>
        <th>Latitiude</th>
        <th>Longitiude</th>
        <th>Image</th>
        <th>Added_by</th>
      </tr>
      <xsl:for-each select="Birdcatch/BIrds/Bird">
      <tr>
        <td><xsl:value-of select="@id" /></td>
        <td><xsl:value-of select="Species" /></td>
        <td><xsl:value-of select="About_bird" /></td>
        <td><xsl:value-of select="Date_added" /></td>
        <td><xsl:value-of select="Address" /></td>
        <td><xsl:value-of select="Age" /></td>
        <td><xsl:value-of select="Sex" /></td>
        <td><xsl:value-of select="Location/Latitiude" /></td>
        <td><xsl:value-of select="Location/Longitiude" /></td>
        <td><xsl:value-of select="Image" /></td>
        <td><xsl:value-of select="Added_by" /></td>
      </tr>
      </xsl:for-each>
    </table>
  </body>
  </html>
</xsl:template>
</xsl:stylesheet>

I want to display image in the Image col column in the table. How can I do this?

我想在表格的Image col列中显示图像。我怎样才能做到这一点?

2 个解决方案

#1

Instead of:

<td><xsl:value-of select="Image" /></td>

try:

<td><img src="{Image}"></img></td>

Untested, because no XML source was provided.

未经测试,因为未提供XML源。

#2

you can use strpos method getting data between td if you can add id or class for images td like this

你可以使用strpos方法在td之间获取数据,如果你可以像这样为图像添加id或类

<td class="img"><xsl:value-of select="Image" /></td>

    $start = strpos($html, '<td class="img">') + 16;
// we are going to start getting from <td class="img">
    $length = strpos($html, '"></td>') - $start;
    $src = substr($html, $start, $length);

echo $src;

edit: if you do not want to use php, you can use jquery

编辑:如果你不想使用php,你可以使用jquery

 $(document).ready(function(){

   $.ajax({
    type: "GET",
    url: "yourxml.xml",
    dataType: "xml",
    success: function(xml) {
    }
    $(xml).find('addtaginyourdataloop').each(function(){
    var $start=  var $row = $(this).closest("td").text();
    var $text = $start.find(".img").text(); 
     alert($text); //and we get the url.
    });
    });

#1