首页 > 代码库 > 如何控制XML文档的样式
如何控制XML文档的样式
xml文档是纯文本文件，虽然内容是完全自定义的，但显示的效果就差强人意了，那么是否可以让xml文档也像html文档那样可以有丰富多彩的显示效果呢？当然可以，html文档是通过css文档来控制显示样式的，xml文档可以通过xsl文档来控制，其实质就是把xml文档通过xslt(xsl transformations)转换成html文档，或者比html更严谨的xhtml文档。
那么如何读取xml文档中的数据呢？下面通过一个例子来实验一下：
首先看一下最原始的xml文档：
1 <?xml version="1.0"?> 2 <team> 3 <people type="teacher" id="2"> 4 <name>zhangsan</name> 5 <gender>f</gender> 6 </people> 7 <people type="teacher" id="5"> 8 <name>lisi</name> 9 <gender>m</gender>10 </people>11 <people type="student" id="1">12 <name>wangwu</name>13 <gender>f</gender>14 </people>15 <people type="teacher" id="3">16 <name>zhaoliu</name>17 <gender>f</gender>18 </people>19 <people type="teacher" id="1">20 <name>maqi</name>21 <gender>m</gender>22 </people>23 </team>
接下来，先搭一个xsl文档的基本框架：
1 <?xml version="1.0"?> 2 <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> 3 <xsl:template match="/"> 4 <html> 5 <body> 6 <h2>Team People Collection</h2> 7 <table border="1"> 8 <tr bgcolor="#9acd32"> 9 <th align="left">Name</th>10 <th align="left">Gender</th>11 </tr>12 </table>13 </body>14 </html>15 </xsl:template>
xsl文档本身其实也是个xml文档，所以最开始也需要xml声明。
现在的xsl文档只是个空架子，因为里面并没有获取xml文档的数据，接下来看如何填充数据。
通过<xsl:value-of select="team/people/name" /> 可提取select选定节点的值，并添加到转换的html文档中。
但这样只能获取一行的数据，如果有很多people节点，如何全都获取呢？
再来看<xsl:for-each select="team/people"></xsl:for-each>可遍历select选定节点的值。
数据都取出来了，我们还想再排下序，没问题，在<xsl:for-each>下添加子节点<xsl:sort select="name">。
但可能有些并不是我们想要的，可以通过<xsl:for-each select="team/people[name=‘zhangsan‘]">过滤xml中的元素。
注意过滤运算符有：
= 等于
!= 不等于
< 小于
> 大于
现在的xsl文档变成了下面的样子：
1 <?xml version="1.0"?> 2 <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> 3 <xsl:template match="/"> 4 <html> 5 <body> 6 <h2>Team People Collection</h2> 7 <table border="1"> 8 <tr bgcolor="#9acd32"> 9 <th align="left">Name</th>10 <th align="left">Gender</th>11 </tr>12 <xsl:for-each select="team/people[name=‘zhangsan‘]">13 <xsl:sort select="name"/>14 <tr>15 <td><xsl:value-of select="name"/></td>16 <td><xsl:value-of select="gender"/></td>17 </tr>18 </xsl:for-each>19 </table>20 </body>21 </html>22 </xsl:template>23 </xsl:stylesheet>
xsl文档完成了，最后在xml文档中引入此xsl文档即可，最后的xml文档如下：
1 <?xml version="1.0"?> 2 <?xml-stylesheet type="text/xsl" href="http://www.mamicode.com/XSLTDemo.xsl"?> 3 <team> 4 <people type="teacher" id="2"> 5 <name>zhangsan</name> 6 <gender>f</gender> 7 </people> 8 <people type="teacher" id="5"> 9 <name>lisi</name>10 <gender>m</gender>11 </people>12 <people type="student" id="1">13 <name>wangwu</name>14 <gender>f</gender>15 </people>16 <people type="teacher" id="3">17 <name>zhaoliu</name>18 <gender>f</gender>19 </people>20 <people type="teacher" id="1">21 <name>maqi</name>22 <gender>m</gender>23 </people>24 </team>
注：此处xml文档和xsl文档放在了同一个文件夹下。
现在，在浏览器中打开xml文档就可以看到不一样的效果了，快来试试吧！
如何控制XML文档的样式