您好我使用xml，php和css进行样式设计。
但是有可能在xml文件中包含信息。并使用xslt在表中显示信息。我也有PHP和javascript文件。
XML文件
<?xml version="1.0"?>
<TT>
<BUS>
<NUMBER>120</NUMBER>
<LEAVING>Howth</LEAVING>
<DESTINATION>Dublin Airport</DESTINATION>
<TIME>06:00, 07:00, 08:10, 9:10, 10:00,
11:25, 12:00, 13:00, 14:00, 15:20, 16:00, 17:00, 18:00</TIME>
</BUS>
</TT>
PHP
<?php
$id=$_GET['q'];
$dom=new DOMDocument;
$dom->load( 'routes.xml' );
$col=$dom->getElementsByTagName('NUMBER');
if( $col ){
foreach( $col as $node ){
if( $node->nodeType==XML_ELEMENT_NODE && $node->nodeValue==$id ) {
$parent=$node->parentNode;
}
}
$html=array();
$html[]='
</br>
<table border="2">
<tr>
<th>NUMBER</th>
<th>LEAVING</th>
<th>DESTINATION</th>
<th>TIME</th>
</tr>
<tr>';
foreach( $parent->childNodes as $node ){
if( $node->nodeType==XML_ELEMENT_NODE ) $html[]='<td>'.$node- >nodeValue.'</td>';
}
$html[]='</tr><tr background-color: #f2f2f2></table>';
echo implode( PHP_EOL, $html );
}
?>
的JavaScript
function showBus(str){
if (str==""){
document.getElementById("txtHint").innerHTML="";
return;
}
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
} else { // code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4 && xmlhttp.status==200){
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","getbus.php?q="+str,true);
xmlhttp.send();
}
HTML
<body>
<form>
<h3>Select your bus route:</h3>
<select name="NUMBER" onchange="showBus(this.value)">
<option value="">Select a Bus:</option>
<option value="15">15</option>
<option value="22">22</option>
<option value="37">37</option>
<option value="44">44</option>
<option value="120">120</option>
</select>
<div id="txtHint"><b>Bus info will be listed here...</b></div>
</form>
</body>
</html>
我想在菜单中显示带有每个BUS编号的xml数据，当你点击数字时，目的地时间等信息显示在一个表格中，但我希望它使用xslt而不是html。
答案 0 :(得分：1)
事实上，所有这些都可以使用XSLT而不是PHP来完成，它可以更多地参与但是可以做到。我仍然使用原始问题发布了原始XSL文件，并在此稍作修改。
unload<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<!-- we want to output html -->
<xsl:output method='html' standalone='yes' indent='yes' encoding='utf-8'/>
<!-- this is the important bit, the bus number ~ id -->
<xsl:param name="id">id</xsl:param>
<xsl:template match="/">
<table border="1">
<tr bgcolor="#9acd32">
<th>NUMBER</th>
<th>LEAVING</th>
<th>DESTINATION</th>
<th>TIME</th>
</tr>
<xsl:for-each select="TT/BUS">
<xsl:choose><!-- perform a test using the supplied id param -->
<xsl:when test="NUMBER=$id">
<tr>
<td><xsl:value-of select="NUMBER"/></td>
<td><xsl:value-of select="LEAVING"/></td>
<td><xsl:value-of select="DESTINATION"/></td>
<td><xsl:value-of select="TIME"/></td>
</tr>
</xsl:when>
</xsl:choose>
</xsl:for-each>
</table>
</xsl:template>
</xsl:stylesheet>
你需要一个表单，你需要能够识别用户，你需要有一个位置来存储生成的xml文件，也可能是一大堆其他东西。所以，很快：
<?php
$id=$_GET['q'];
/* Create DOMDocument for the xml */
$dom=new DOMDocument;
$dom->load( __DIR__.DIRECTORY_SEPARATOR.'routes.xml' );
/* Create the xslt processor & import stylesheet */
$proc=new XSLTProcessor();
$xsl = new DOMDocument;
$xsl->load( __DIR__.DIRECTORY_SEPARATOR.'routes.xsl' );
$proc->importStyleSheet( $xsl );
/* ! set the parameter to use in the stylesheet ! */
$proc->setParameter('', 'id', $id );
/* Transform the xml and display result */
if( $html = $proc->transformToXML( $dom ) ){ echo $html; }
/* tidy up */
$dom = $xsl = $proc = $html = null;
?>
答案 1 :(得分：0)
这是一个没有PHP的纯XSLT解决方案。它不使用PHP，也不使用JavaScript（除了链接到自我库）。它是纯Html，CSS和XSLT 2.0。
鉴于此输入文档，位于相对网址buses.xml ...
<TT>
<BUS>
<NUMBER>120</NUMBER>
<LEAVING>Howth</LEAVING>
<DESTINATION>Dublin Airport</DESTINATION>
<TIME>06:00, 07:00, 08:10, 9:10, 10:00,
11:25, 12:00, 13:00, 14:00, 15:20, 16:00, 17:00, 18:00</TIME>
</BUS>
<BUS>
<NUMBER>200</NUMBER>
<LEAVING>Sydney</LEAVING>
<DESTINATION>Melbourne</DESTINATION>
<TIME>06:01, 07:01, 08:11, 9:11, 10:01,
11:25, 12:00, 13:00, 14:00, 15:20, 16:00, 17:01</TIME>
</BUS>
</TT>
...此主机页面可以查看交互式公交车时刻表，网址为...
<html>
<head>
<title>Bus time-tables</title>
<link href="buses.css" rel=stylesheet type="text/css">
<script type="text/javascript" language="javascript" src="js/Saxonce/Saxonce.nocache.js"></script>
<script type="application/xslt+xml" language="xslt2.0" src="buses.xsl" data-source="buses.xml"></script>
</head>
<body>
<form>
<h3>Select your bus route:</h3>
<div id="bus-options"></div>
</form>
<table>
<thead>
<tr>
<th>Bus number</th>
<th>Departing from</th>
<th>Arriving at</th>
<th>Schedule</th>
</tr>
</thead>
<tbody id="bus-rows"></tbody>
</table>
</body>
</html>
...当浏览器加载时，利用位于网址buses.xsl的XSLT 2.0样式表...
<xsl:transform
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns:ixsl="http://saxonica.com/ns/interactiveXSLT"
xmlns:prop="http://saxonica.com/ns/html-property"
xmlns:style="http://saxonica.com/ns/html-style-property"
xmlns:xs="http://www.w3.org/2001/XMLSchema"
exclude-result-prefixes="xs prop"
extension-element-prefixes="ixsl"
version="2.0">
<xsl:template match="/">
<xsl:result-document href="#bus-options" method="ixsl:replace-content">
<select name="NUMBER">
<option value="">Select a Bus:</option>
<xsl:apply-templates select="TT/BUS" mode="bus-option" />
</select>
</xsl:result-document>
</xsl:template>
<xsl:template match="BUS" mode="bus-option">
<option value="{NUMBER}"><xsl:value-of select="NUMBER"/></option>
</xsl:template>
<xsl:template match="select[@name='NUMBER']" mode="ixsl:onclick">
<xsl:variable name="bus" select="@prop:value"/>
<xsl:for-each select="ixsl:source()/TT/BUS[NUMBER eq $bus]">
<xsl:result-document href="#bus-rows" method="ixsl:replace-content">
<tr>
<td><xsl:value-of select="$bus"/></td>
<td><xsl:value-of select="LEAVING"/></td>
<td><xsl:value-of select="DESTINATION"/></td>
<td>
<ul>
<xsl:for-each select="tokenize(TIME,',')">
<li><xsl:value-of select="."/></li>
</xsl:for-each>
</ul>
</td>
</tr>
</xsl:result-document>
</xsl:for-each>
</xsl:template>
</xsl:transform>
相对网址buses.css需要 CSS样式表。我使用过这个内容，但并不重要。 ...
table {
border-collapse: collapse;
}
td,
th {
border: 1px solid #999;
padding: 0.5rem;
text-align: left;
}
td {
background: hsl(150, 50%, 50%);
}
所需的最终资源是Saxon/CE library 。资源应放在相对网址js/Saxonce/Saxonce.nocache.js。
这是完美的解决方案。表的主体动态地改变以匹配用户对总线的选择。没有回电。所有切换都在客户端完成，因此性能可以很好地扩展。数据，html结构，视觉样式和业务规则被巧妙地分隔成单独的文件。用户可以编写自己的总线路径并将其保存在xml文件中。整个解决方案小而简单。