xslt文件是xml的样式表文件,随着xml数据交换格式的普遍化,xslt也在很多方面得到了很大的应该。
应用1)页面的静态化技术。听说以前的csdn论坛就采用了服务器端生成xml,然后将生成静态文本的任务交给客户端,减少了服务器压力。
2)服务器控件的开发技术。比如Infragistics.WebUI.UltraWebGrid控件,客户端的排序翻页等等,无不看到xslt的影子。
3)自动化表单。根据数据库配置动态生成添加表单,并自动保存。那么这个表单的样式如何定义呢。这里可以考虑xslt了,目前正在做这方面的研究,
等有一点成果的时候,写出来和大家一起学习。
今天就来学学最基础的东西,看看客户端如果将xml通过xslt样式,表现成我们需要的html
xml文件如下:
Code
<Test Caption="三月份临时招聘面试题">
<Questions>
<Question Caption="问题一" Content="毕业院校" />
<Question Caption="问题二" Content="你有什么爱好">
<Answer Caption="A" Content="篮球" IsRight="true" />
<Answer Caption="B" Content="足球" IsRight="false" />
<Answer Caption="C" Content="羽毛球" IsRight="false" />
<Answer Caption="D" Content="舞蹈" IsRight="false" />
<Answer Caption="E" Content="游泳" IsRight="false" />
<Answer Caption="F" Content="其他" IsRight="false" />
</Question>
<Question Caption="问题三" Content="什么时候可以来上班?">
<Answer Caption="A" Content="一个星期" IsRight="true" />
<Answer Caption="B" Content="两个星期" IsRight="false" />
<Answer Caption="C" Content="三个星期" IsRight="false" />
<Answer Caption="D" Content="一个月" IsRight="false" />
</Question>
</Questions>
</Test>
xslt文件如下:
Code
<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns:msxsl="urn:schemas-microsoft-com:xslt" exclude-result-prefixes="msxsl">
<xsl:output method="xml" indent="yes"/>
<xsl:template match="/">
<table width="100%" border="0">
<tr>
<td height="30px" align="center">
<h1>
<xsl:value-of select="Test/@Caption"/>
</h1>
</td>
</tr>
</table>
<xsl:for-each select="Test/Questions/Question">
<table width="100%" border="1" cellspacing="0" cellpadding="0" bordercolordark="#0099FF" bordercolorlight="#FFFFFF">
<tr>
<td class="td">
<xsl:value-of select="@Caption"/>:
<xsl:value-of select="@Content"/>
</td>
</tr>
<xsl:for-each select="Answer">
<tr>
<td class="td">
(<xsl:value-of select="@Caption"/>)
<xsl:value-of select="@Content"/>
</td>
</tr>
</xsl:for-each>
</table>
<table width="100%" border="0">
<tr>
<td height="3px"></td>
</tr>
</table>
</xsl:for-each>
</xsl:template>
</xsl:stylesheet>
客户端页面如下:
Code
<script type="text/javascript">
function pageLoad(sender,eventArgs)
{
var xml=sg.xmlDocument();
xml.async=false;//一定要同步载入
xml.load(xmlPath);
var xslt=sg.xmlDocument();
xslt.async=false;
xslt.load(xsltPath);
//document.write(xml.transformNode(xslt));
TestContainer.innerHTML=xml.transformNode(xslt);
}
</script>
<div id="TestContainer" style="90%;overflow-y:auto;">
1)注意一定要同步载入,否则可能出错。
2)关于xpath的相关技术,可以去w3school网站看看。
本文虽然写的很简单,但是揭示了基本的原理,更多深层的挖掘待以后的文章详述