如何使用 XSL 代码在 HTML table 中显示图像?
How to display an image inside a HTML table using XSL code?
我为我的 XML Web 服务创建了一个 XSL 样式 sheet。我的 HTML 上有数据库输出的图像 link。但是我的 XSL 只显示 link 而不是 link 包含的图像。我想使用 XSL 在 HTML table 中显示直接图像。
这是我的 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>
我想在 table 的图像列中显示图像。我该怎么做?
你可以使用strpos方法获取td之间的数据
如果您可以像这样为图像添加 id 或 class
<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;
编辑:如果不想用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.
});
});
而不是:
<td><xsl:value-of select="Image" /></td>
尝试:
<td><img src="{Image}"></img></td>
未测试,因为未提供 XML 来源。
我为我的 XML Web 服务创建了一个 XSL 样式 sheet。我的 HTML 上有数据库输出的图像 link。但是我的 XSL 只显示 link 而不是 link 包含的图像。我想使用 XSL 在 HTML table 中显示直接图像。
这是我的 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>
我想在 table 的图像列中显示图像。我该怎么做?
你可以使用strpos方法获取td之间的数据 如果您可以像这样为图像添加 id 或 class
<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;
编辑:如果不想用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.
});
});
而不是:
<td><xsl:value-of select="Image" /></td>
尝试:
<td><img src="{Image}"></img></td>
未测试,因为未提供 XML 来源。