1 XML和XSL简介
1.1 XML
XML是可扩展标记语言（EXtensible Markup Language）的缩写，它被设计用来传输和存储数据，并于1998年2月成为W3C的推荐标准。
图1-1 XML代码示例
上面是一小段XML代码，与HTML最大的区别在于，XML被设计为传输和存储数据，其焦点是数据的内容，并且XML的标签是自定义的；而HTML被设计用来显示数据，其焦点是数据的外观。XML是与描述、传输信息相关的，而HTML是与显示信息相关的（资料来源于W3School）。
1.2 XSL
XSL是扩展样式表语言（EXtensible Stylesheet Language）的缩写，是一种用于以可读格式呈现 XML 数据的语言。XSL包含XSLT、Xpath和XSL-FO三个部分：XSLT用于转换XML文档，Xpath用于选取XML元素和属性，XSL-FO用于格式化XML文档。
本文只涉及到XSL里的XSLT和Xpath。XSLT于1999年11月被确立为W3C标准，用于将XML文档转换为HTML、文本或者XML三种类型的文档（本文仅涉及到转换为HTML文档的情况），而Xpath是XSLT的主要元素之一。XSL-FO就一边寂寞去吧。
2 XML+XSLT结构的实现
用XML+XSLT结构输出页面可以理解为，使用XML存储数据，使用XSLT编写页面结构，感觉上像把HTML拆开了。XML文档在组织数据的同时，通过语句调用XSLT页面。在XSLT页面中，HTML语句编写基础结构，Xpath选取XML相应的数据节点，然后通过XSLT语句将这两者结合起来。
更为专业的描述是这样的：在转换的过程中，XSLT用Xpath来定义源文档中与一个或多个预先确定的模板相匹配的部分。当找到了一个匹配时，XSLT就将源文档中的匹配部分转换成结果文档；而源文档中不与任何一个模板匹配的部分最终在结果中保持不变。（摘自developerWorks）
2.1 结构示例
这里使用DNF的一个专题举个例子。此专题的访问地址是：http://dnf.qq.com/act/a20090710wcg/
这是一个赶工的专题，页面代码没太多的参考性，只是拿出来做个示例，并且由于专题比较简单，XSLT文档只用到了部分XSLT语句，属于简单应用。首页使用的是HTML，因为XML不在默认首页文件格式之列，因此只有二级页采用了XML+XSLT结构。对于其中“代表队介绍”这个二级页面：
XML文档：http://dnf.qq.com/act/a20090710wcg/players.xml
XSLT文档：http://dnf.qq.com/act/a20090710wcg/xslt/player.xsl，http://dnf.qq.com/act/a20090710wcg/xslt/commens.xsl
XML和XSLT是树状结构的，在浏览器中可以看到。XSLT文档中，以”<xsl:”开头的就是XSLT语句，”select”属性里的内容则是Xpath表达式（Xpath表达式不只存在于select属性里），可以看到里面也包含了许多HTML代码。XML和XSLT代码是强制要求闭合。
其中player.xml文档调用了player.xsl文档，XML文档不做解释了。简述一下XSLT的文档结构含义。
文档第一排是一条XML声明语句；第二行stylesheet语句声明XSLT版本和命名空间，所有的其他XSLT语句都必须包含在此语句内；第三行是import语句，调用具有公共模块的文档commens.xsl（commens.xsl文档包括顶部白色banner条，页面header块，导航，脚部声明四个模块）；第四行是output语句，表明将XML文档转换为HTML文件并输出；然后通过template语句建立根模块。紧接着的就是HTML代码了，<body>标签后是一个call-template语句，调用顶部白色banner条。HTML代码就不再解释了。接着的XSLT代码是两个call-template语句，调用HTML页面header块和导航模块。跟着是两个for-each语句循环相同的结构，并通过Xpath选取XML数据，一个循环用于生成“个人赛”资料，另一个用于生成“团队赛”资料，中间有很多value-of语句，用于调用XML相应节点的值。接着是call-template语句，调用脚部声明模块，最后是页面的一些标签闭合。
3 XML+XSLT结构的优势
3.1 数据交换
XML本身是用于网络上数据交换的语言，我可以调用互联网里的其他XML文件（当然，要经过作者同意），通过编写XSLT或者其他语言脚本（如ActionScript、JavaScript等），变成自己作品上的内容。
XML 是独立于软件和硬件的信息传输工具，它的简单使其易于在任何应用程序中读写数据。我们在使用XSLT转换XML为HTML的同时，此XML文档还可以被其他各种脚本或开发语言调用。
3.2 代码大小
XSLT有个很大的优点是模块化，如同JavaScript里的function一样，需要时调用，同时也可以传递参数。这样，网站各个页面所具有的相同部分（比如导航，版权声明等，甚至可以是HTML里的<head>标签）就可以单独提出来，封装在一个模块内，每个页面的这个部分就可以替换为一条调用对应模块的代码。
XSLT同时拥有循环语句，可以对代码里相同的结构进行循环（比如li、tr等），同时遍历应用这个结构的XML数据，避免了因拥有相同结构的数据而重复编写代码。
XSLT文档可以相互调用，延长了文档的使用寿命，你可以调用以前写过的XSLT来使用里面的模块，不用再次编写，你甚至可以调用别人写过并发布在互联网上的文档（只要作者同意），这样在一定程度上节约了精力和成本。
XML+XSLT结构大大减少了代码大小，并且随着XML数据量和页面数量的增加而越发明显。当然，数据量大过头对XML不是什么好事。
3.3 代码维护
利用XSLT的模块功能，对于页面相同部分的修改变得很简单，不用像以前一样打开N个文件批量替换，我们只需要对XSLT文件的模块代码进行修改。虽然也可以利用JavaScript编写各个页面的相同部分，然后调用，但代码的可读性远远比不上XSLT的模块来得直接。
利用XSLT的循环代码，修改数据的结构不再变得痛苦。想象当你要把一个庞大的table结构的数据变成li结构时，批量替换已无法满足要求。如果使用XSLT文档，并利用循环代码，你只需要修改一个循环的公共结构就OK了。
3.4 节约访问资源
对于现在腾讯的游戏官网，比如首页的各种新闻列表，是使用JavaScript调用的，即服务器接到请求后，再开始从数据库里查找新闻，然后返回。
我们其实可以换一种方式，即后台事先根据页面需要生成XML文档，并保持每隔一个固定时间更新一次XML文档，然后使用XSLT输出页面，这样就在一定程度上节省了页面下载时间。
同时，由于后台直接生成XML文档，不再因为N个新闻列表而向服务器发送N个请求，减少了页面的请求数。
4 使用XML+XSLT结构的可能性
4.1 浏览器支持
几乎所有主要的浏览器均支持 XML + XSLT结构的页面。Firefox从1.0.2开始支持XML和XSLT；Netscape从8.0开始支持XML和XSLT；Opera从9.0开始支持XML和XSLT；IE从6.0开始支持XML、XSLT和Xpath（资料来源于W3School）。
当然还有Safari和Chrome，貌似这两个浏览器是支持的（至少我安装的这两个浏览器没发现啥问题）。
4.2 编写难度
相对于HTML的编写，XML+XSLT的过程要复杂一些。毕竟要先写好XML、HTML、CSS和JavaScript文档，然后再在HTML文档的基础上编写XSLT文档，多个页面还需要根据文档进行模块提取，以便各文档调用。
从整个过程来看，确实复杂一些，但这个复杂也是“先苦后甜”的写照。完成XSLT文档后，可以节省很多资源，也对以后的维护有很大的好处。
4.3 后台开发
需要程序员将数据库里的数据按页面需要导出为相应的XML文件，或者直接使用XML存储数据（但比如新闻之类的信息数量很庞大，使用XML直接存储数据会降低效率）。各种开发语言都能将数据库中的数据输出为XML文档，相信难度不大。
4.4 竞争
XSLT当然不是唯一能转换XML文档的方式，其他语言脚本也可以实现与XSLT相同的功能。但是，其他语言脚本的使用远不及XSLT来的直接。XSLT可以直接使用HTML元素，并且可以使用Xpath很直观的选取XML文档节点。而且在XML+XSLT结构中，XML文档的调用很方便，只需在XML文档里写一条xml-stylesheet调用语句。
4.5 SEO
这可能是XML+XSLT结构最郁闷的地方了，网上貌似还没有使用此结构替换HTML对于SEO影响的定论。但各种迹象表明，使用XML+XSLT结构会在一定程度上对SEO造成不良的影响。
4.6 适用性偏向
由于XML本身是作为描述和传输信息的文档，注定了XML+XSLT结构更适合于信息展示类的页面，比如新闻，相册等，所以游戏官网很适合使用此结构来完成。而功能性较多的页面就不适合使用此结构，比如注册，发布系统等。
暴雪公司的所有游戏官网均采用XML+XSLT结构。
星际争霸2：http://www.starcraft2.com/
魔兽世界：http://www.worldofwarcraft.com/
暗黑破坏神3：http://www.blizzard.com/diablo3/
5 综上所述
XML+XSLT结构目前并不流行，虽然XML已广泛应用，但XSL由于各种原因并未能普及。对于腾讯的游戏官网建设，由于首页的各类信息调用涉及到很多产品或系统的接口，而广告和新闻也是还是使用JavaScript调用的方式生成，XML+XSLT结构的全面应用在短期来看是不大可能的，目前也只有用于纯静态的图片视频展示，资料站等。XML+XSLT结构的普及任重而道远。
才疏学浅，个人愚见，仅供亵玩。
以下为自己调试的代码
XMLTest.xml 页面
<?xml version="1.0" encoding="gb2312" ?>
<?xml-stylesheet type="text/xsl" href="XsLTTest.xslt"?>
<languages>
<languages_charset>gb2312</languages_charset>
<Reset>重填</Reset>
<Submit>提交</Submit>
<Password>密码</Password>
<ID>用户名</ID>
</languages>
XsLTTest.xslt 页面
<?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="html" encoding="gb2312" omit-xml-declaration="yes" indent="yes" standalone="yes"/>
<xsl:template match="/">
<html>
<META http-equiv="Content-Type" content="text/html;">
<xsl:attribute name="charset">
<xsl:value-of select="languages/languages_charset"/>
</xsl:attribute>
</META>
<body>
<table cellspacing="2" cellpadding="2" border="0">
<tr>
<td>
<xsl:value-of select="languages/ID" />
</td>
<td>
<input type="text"/>
</td>
</tr>
<tr>
<td>
<xsl:value-of select="languages/Password" />
</td>
<td>
<input type="text"/>
</td>
</tr>
<tr>
<td>
<input type="submit" >
<xsl:attribute name="value">
<xsl:value-of select="languages/Submit" />
</xsl:attribute>
</input>
</td>
<td>
<input type="reset" >
<xsl:attribute name="value">
<xsl:value-of select="languages/Reset" />
</xsl:attribute>
</input>
</td>
</tr>
</table>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
最后用浏览器直接查看XMLTest.xml 就可以看到效果了
166
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
