我有一些看起来像这样的XML
XML:
<?xml version="1.0"?>
<?xml-stylesheet type='text/xsl' href='style.xslt'?>
<LogFileProcessing>
<Test>
<Script>
<Name>Test 1</Name>
<Results>
<RunResult>
<RunNumber>1</RunNumber>
<Outcome>Pass</Outcome>
<StartTime>10:42:25</StartTime>
<EndTime>10:43:58</EndTime>
<Date>25/03/2014</Date>
<Duration>93 seconds</Duration>
</RunResult>
<RunResult>
<RunNumber>2</RunNumber>
<Outcome>Pass</Outcome>
<StartTime>10:44:03</StartTime>
<EndTime>10:45:13</EndTime>
<Date>25/03/2014</Date>
<Duration>70 seconds</Duration>
</RunResult>
</Results>
</Script>
<Script>
<Name>Test 2</Name>
<Results>
<RunResult>
<RunNumber>1</RunNumber>
<Outcome>Pass</Outcome>
<StartTime>10:45:17</StartTime>
<EndTime>10:46:37</EndTime>
<Date>25/03/2014</Date>
<Duration>80 seconds</Duration>
</RunResult>
<RunResult>
<RunNumber>2</RunNumber>
<Outcome>Pass</Outcome>
<StartTime>10:46:41</StartTime>
<EndTime>10:47:49</EndTime>
<Date>25/03/2014</Date>
<Duration>68 seconds</Duration>
</RunResult>
</Results>
</Script>
</Test>
这是我用来转换它的xsl文件
<?xml version="1.0" encoding="UTF-8"?>
<html xsl:version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<body style="font-family:Arial;font-size:12pt;background-color:#EEEEEE">
<xsl:for-each select="LogFileProcessing/Test/Script">
<div style="font-family:Arial;background-color:teal;color:white;padding:4px">
<span style="font-family:Arial;font-weight:bold"><xsl:value-of select="Name"/></span>
</div>
<div style="font-family:Arial;margin-left:75px;margin-bottom:1em;font-size:10pt">
<p>
<table border="1">
<tr style="color:white" bgcolor="Teal">
<th>Run</th>
<th>Date</th>
<th>Start Time</th>
<th>End Time</th>
<th>Duration</th>
<th>Pass/Fail</th>
<th>Reason</th>
</tr>
<xsl:for-each select="Results/RunResult">
<tr>
<xsl:choose>
<xsl:when test="Outcome = 'Fail'">
<td bgcolor="Red">
<xsl:value-of select="RunNumber"/>
</td>
</xsl:when>
<xsl:otherwise>
<td bgcolor="White"><xsl:value-of select="RunNumber"/></td>
</xsl:otherwise>
</xsl:choose>
<xsl:choose>
<xsl:when test="Outcome = 'Fail'">
<td bgcolor="Red">
<xsl:value-of select="Date"/>
</td>
</xsl:when>
<xsl:otherwise>
<td bgcolor="White"><xsl:value-of select="Date"/></td>
</xsl:otherwise>
</xsl:choose>
<xsl:choose>
<xsl:when test="Outcome = 'Fail'">
<td bgcolor="Red">
<xsl:value-of select="StartTime"/>
</td>
</xsl:when>
<xsl:otherwise>
<td bgcolor="White"><xsl:value-of select="StartTime"/></td>
</xsl:otherwise>
</xsl:choose>
<xsl:choose>
<xsl:when test="Outcome = 'Fail'">
<td bgcolor="Red">
<xsl:value-of select="EndTime"/>
</td>
</xsl:when>
<xsl:otherwise>
<td bgcolor="White"><xsl:value-of select="EndTime"/></td>
</xsl:otherwise>
</xsl:choose>
<xsl:choose>
<xsl:when test="Outcome = 'Fail'">
<td bgcolor="Red">
<xsl:value-of select="Duration"/>
</td>
</xsl:when>
<xsl:otherwise>
<td bgcolor="White"><xsl:value-of select="Duration"/></td>
</xsl:otherwise>
</xsl:choose>
<xsl:choose>
<xsl:when test="Outcome = 'Fail'">
<td bgcolor="Red">
<xsl:value-of select="Outcome"/>
</td>
</xsl:when>
<xsl:otherwise>
<td bgcolor="White"><xsl:value-of select="Outcome"/></td>
</xsl:otherwise>
</xsl:choose>
<xsl:choose>
<xsl:when test="Outcome = 'Fail'">
<td bgcolor="Red">
<xsl:value-of select="FailureReason"/>
</td>
</xsl:when>
<xsl:otherwise>
<td bgcolor="White"><span>N/A</span></td>
</xsl:otherwise>
</xsl:choose>
</tr>
</xsl:for-each>
</table>
</p>
</div>
</xsl:for-each>
</body>
</html>
我确信有更好的方法可以实现上述目标,但我想要做的是有一个链接,最好是在每个名称行上显示或隐藏直接显示在其下方的表格。< / p>
我尝试了document.style.display not sticking for some reason
的内容和
http://p2p.wrox.com/xslt/55403-hiding-showing-table-html-through-xslt.html
但作为编码,XML和XSL世界的菜鸟,我有点迷失。感谢任何帮助,并转发我对此主题的理解。
由于
答案 0 :(得分:0)
HTML5可以在没有Javascript的情况下使用details
和summary
元素执行此操作:
<html xsl:version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<head>
<title>Test</title>
</head>
<body style="font-family:Arial;font-size:12pt;background-color:#EEEEEE">
<xsl:for-each select="LogFileProcessing/Test/Script">
<details>
<summary style="font-family:Arial;background-color:teal;color:white;padding:4px">
<span style="font-family:Arial;font-weight:bold"><xsl:value-of select="Name"/></span>
</summary>
<div style="font-family:Arial;margin-left:75px;margin-bottom:1em;font-size:10pt">
<table border="1">
<tr style="color:white" bgcolor="Teal">
<th>Run</th>
<th>Date</th>
<th>Start Time</th>
<th>End Time</th>
<th>Duration</th>
<th>Pass/Fail</th>
<th>Reason</th>
</tr>
<xsl:for-each select="Results/RunResult">
<tr>
<xsl:choose>
<xsl:when test="Outcome = 'Fail'">
<td bgcolor="Red">
<xsl:value-of select="RunNumber"/>
</td>
</xsl:when>
<xsl:otherwise>
<td bgcolor="White"><xsl:value-of select="RunNumber"/></td>
</xsl:otherwise>
</xsl:choose>
<xsl:choose>
<xsl:when test="Outcome = 'Fail'">
<td bgcolor="Red">
<xsl:value-of select="Date"/>
</td>
</xsl:when>
<xsl:otherwise>
<td bgcolor="White"><xsl:value-of select="Date"/></td>
</xsl:otherwise>
</xsl:choose>
<xsl:choose>
<xsl:when test="Outcome = 'Fail'">
<td bgcolor="Red">
<xsl:value-of select="StartTime"/>
</td>
</xsl:when>
<xsl:otherwise>
<td bgcolor="White"><xsl:value-of select="StartTime"/></td>
</xsl:otherwise>
</xsl:choose>
<xsl:choose>
<xsl:when test="Outcome = 'Fail'">
<td bgcolor="Red">
<xsl:value-of select="EndTime"/>
</td>
</xsl:when>
<xsl:otherwise>
<td bgcolor="White"><xsl:value-of select="EndTime"/></td>
</xsl:otherwise>
</xsl:choose>
<xsl:choose>
<xsl:when test="Outcome = 'Fail'">
<td bgcolor="Red">
<xsl:value-of select="Duration"/>
</td>
</xsl:when>
<xsl:otherwise>
<td bgcolor="White"><xsl:value-of select="Duration"/></td>
</xsl:otherwise>
</xsl:choose>
<xsl:choose>
<xsl:when test="Outcome = 'Fail'">
<td bgcolor="Red">
<xsl:value-of select="Outcome"/>
</td>
</xsl:when>
<xsl:otherwise>
<td bgcolor="White"><xsl:value-of select="Outcome"/></td>
</xsl:otherwise>
</xsl:choose>
<xsl:choose>
<xsl:when test="Outcome = 'Fail'">
<td bgcolor="Red">
<xsl:value-of select="FailureReason"/>
</td>
</xsl:when>
<xsl:otherwise>
<td bgcolor="White"><span>N/A</span></td>
</xsl:otherwise>
</xsl:choose>
</tr>
</xsl:for-each>
</table>
</div>
</details>
</xsl:for-each>
</body>
</html>
不幸的是,看起来这些元素的支持在Chrome和Opera和Safari中,而Firefox和IE只提供它们但不支持交互性。因此,对于那些没有实现这些元素的浏览器,我们需要Javascript:
<?xml version="1.0" encoding="UTF-8"?>
<html xsl:version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<head>
<title>Test</title>
<script><![CDATA[
function toggle(summary) {
var details = summary.parentNode;
if (details.nodeType === 1 && details.tagName.toLowerCase() === 'details')
{
if (typeof details.open === 'undefined')
{
var div = details.getElementsByTagName('div')[0];
if (div) {
div.style.display = div.style.display === '' ? 'none' : '';
}
}
}
}
]]></script>
<style>details { display: block;}</style>
</head>
<body style="font-family:Arial;font-size:12pt;background-color:#EEEEEE">
<xsl:for-each select="LogFileProcessing/Test/Script">
<details>
<summary style="font-family:Arial;background-color:teal;color:white;padding:4px" onclick="toggle(this);">
<span style="font-family:Arial;font-weight:bold"><xsl:value-of select="Name"/></span>
</summary>
<div style="font-family:Arial;margin-left:75px;margin-bottom:1em;font-size:10pt">
<table border="1">
<tr style="color:white" bgcolor="Teal">
<th>Run</th>
<th>Date</th>
<th>Start Time</th>
<th>End Time</th>
<th>Duration</th>
<th>Pass/Fail</th>
<th>Reason</th>
</tr>
<xsl:for-each select="Results/RunResult">
<tr>
<xsl:choose>
<xsl:when test="Outcome = 'Fail'">
<td bgcolor="Red">
<xsl:value-of select="RunNumber"/>
</td>
</xsl:when>
<xsl:otherwise>
<td bgcolor="White"><xsl:value-of select="RunNumber"/></td>
</xsl:otherwise>
</xsl:choose>
<xsl:choose>
<xsl:when test="Outcome = 'Fail'">
<td bgcolor="Red">
<xsl:value-of select="Date"/>
</td>
</xsl:when>
<xsl:otherwise>
<td bgcolor="White"><xsl:value-of select="Date"/></td>
</xsl:otherwise>
</xsl:choose>
<xsl:choose>
<xsl:when test="Outcome = 'Fail'">
<td bgcolor="Red">
<xsl:value-of select="StartTime"/>
</td>
</xsl:when>
<xsl:otherwise>
<td bgcolor="White"><xsl:value-of select="StartTime"/></td>
</xsl:otherwise>
</xsl:choose>
<xsl:choose>
<xsl:when test="Outcome = 'Fail'">
<td bgcolor="Red">
<xsl:value-of select="EndTime"/>
</td>
</xsl:when>
<xsl:otherwise>
<td bgcolor="White"><xsl:value-of select="EndTime"/></td>
</xsl:otherwise>
</xsl:choose>
<xsl:choose>
<xsl:when test="Outcome = 'Fail'">
<td bgcolor="Red">
<xsl:value-of select="Duration"/>
</td>
</xsl:when>
<xsl:otherwise>
<td bgcolor="White"><xsl:value-of select="Duration"/></td>
</xsl:otherwise>
</xsl:choose>
<xsl:choose>
<xsl:when test="Outcome = 'Fail'">
<td bgcolor="Red">
<xsl:value-of select="Outcome"/>
</td>
</xsl:when>
<xsl:otherwise>
<td bgcolor="White"><xsl:value-of select="Outcome"/></td>
</xsl:otherwise>
</xsl:choose>
<xsl:choose>
<xsl:when test="Outcome = 'Fail'">
<td bgcolor="Red">
<xsl:value-of select="FailureReason"/>
</td>
</xsl:when>
<xsl:otherwise>
<td bgcolor="White"><span>N/A</span></td>
</xsl:otherwise>
</xsl:choose>
</tr>
</xsl:for-each>
</table>
</div>
</details>
</xsl:for-each>
</body>
</html>
有关示例,请参阅http://home.arcor.de/martin.honnen/xslt/test2014032503.xml。