xml入门序列教程(2) - 将XML数据以HTML形式呈现 - XSL - [1-2]
由于xml一种单纯的数据格式,所以只是用来表示数据, 并没有表示界面的功能, 但是开发中往往需要将xml数据以某种格式呈现出来, 实现这样的一个效果,有2中技术,一个就是借用css(由于能实现的效果有限、以基本无人使用),另一个就是为专门为此量身定做的技术XSL。
一、XSL基本概念
英文全称:eXtensible Stylesheet Language
可扩展样式表语言(自身也是xml格式)
是一种 用于格式化和转换XML的语言
XSL工作的方式: xml + xsl 经过 xslt处理器 处理,得到html结果
我们一起来看看如何将下面的XML
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="stu.xsl"?>
<stulist>
<stu id="a001">
<name>tom</name>
<sex>boy</sex>
<age>19</age>
<math>88</math>
</stu>
<stu id="a002">
<name>lili</name>
<sex>girl</sex>
<age>23</age>
<math>79</math>
</stu>
<stu id="a002">
<name>jim</name>
<sex>boy</sex>
<age>35</age>
<math>59</math>
</stu>
</stulist>
转换成如下HTML页面效果:
首先给出 stu.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="/">
<h1>学生信息</h1>
<xsl:apply-templates select="stulist"/>
<hr/>
<xsl:variable name="stucount">
<xsl:value-of select="count(stulist/stu)"/>
</xsl:variable>
<xsl:variable name="mathsum">
<xsl:value-of select="sum(stulist/stu/math)"/>
</xsl:variable>
总人数:<xsl:value-of select="$stucount"/>
<br/>
数学总分:<xsl:value-of select="$mathsum"/>
<br/>
数学均分:<xsl:value-of select="round($mathsum div $stucount * 100) div 100"/>
<br/>
</xsl:template>
<xsl:template match="stulist">
<table border="1" style="border-collapse:collapse" width="400" cellpadding="4">
<tr>
<th>编号</th>
<th>姓名</th>
<th>性别</th>
<th>年龄</th>
<th>数学成绩</th>
</tr>
<xsl:for-each select="stu">
<tr>
<td>
<xsl:value-of select="@id"/>
</td>
<td>
<xsl:value-of select="name"/>
</td>
<td>
<xsl:value-of select="sex"/>
</td>
<td>
<xsl:value-of select="age"/>
</td>
<td>
<xsl:choose>
<xsl:when test="math >= 80">
<xsl:attribute name="bgcolor">red</xsl:attribute>
</xsl:when>
<xsl:when test="math >= 60">
<xsl:attribute name="bgcolor">green</xsl:attribute>
</xsl:when>
<xsl:otherwise>
<xsl:attribute name="bgcolor">yellow</xsl:attribute>
</xsl:otherwise>
</xsl:choose>
<xsl:value-of select="math"/>
</td>
</tr>
</xsl:for-each>
</table>
</xsl:template>
</xsl:stylesheet>
接下一篇...