XML 和XSLT结合使你的网站设计浑然一体

如果你还未考虑采用一种单一的、紧密结合的方式进行网页设计的话，请看本文。
在网络发展初期，凝聚性（cohesiveness）是由服务器端实现的，但要牵涉到大量的人工文件管理工作。幸运的是，随着网络的日益成熟，网络开发工具也日臻完善。例如，在.NET框架下，你可以创建各种Web控件来统一设计。
XML和XSLT的转换使Web设计受益无穷。借助XML和 XSLT转换，你可以实现将动态用语（dynamic verbiage）和网站内容存储在数据库中。你可以在XML中传输数据库，然后再通过XSLT转换将其转变为HTML脚本。本文中，我将提供一个网站实例，并说明XML 和XSLT如何使你的网站设计浑然一体。
在设计用户/数据交互功能时，我最为关心的是数据的完整性、用户界面的功能性和商务规则的完善实现。我最不关心的是按钮的颜色。而这些细枝末节却往往是程序员发挥技术的地方。
当设计一个全新的页面时，我只投入最低限度的精力用于用户界面的设计，如只安置一个文本框和一个提交按钮。对于本例中的HTML网页，我增加了两个INPUT标签来完成这一任务。
< html>
< head>
< /head>
< body>
< form method="POST" name="thisForm" id="thisForm" action="somepage.php">
< input type="text" name="txtText" id="txtText" size="25">< br>
< input type="submit" name="btnSubmit" id="btnSubmit" value="Submit">
< /form>
< /body>
< /html> 以上代码段完成了主要功能，但还需用XML和XSLT来对其加以美化。
在XML中，代码有开头和结尾标签，而在HTML中没有。INPUT 和BR标签是个特例，它们不需结尾标签。然而，在结尾标签标记“>”前加一个正斜杠，可确保HTML符合XML规范。如果在编写HTML脚本时注意遵从这些规范，你就能够将XML/HTML（aka XHTML）转换为不错的HTML页面。
< form method="POST" name="thisForm" id="thisForm" action="somepage.php">
< input type="text" name="txtText" id="txtText" size="25" transform="blueText"/>
< br/>
< input type="submit" name="btnSubmit" id="btnSubmit" value="Submit"
transform="bigButton"/>
< /form> 运行下列代码，完成XSLT转换：
< ?xml version="1.0"?>
< xsl:stylesheet
xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0"
>
< xsl:output method="html"/>

< xsl:template match="/">
< table width="100%" cellpadding="0" cellspacing="0">
< tr>< td align="center">This is the defined header< /td>< /tr>
< tr>< td>< xsl:apply-templates select="//form"/>< /td>< /tr>
< tr>< td align="center">This is the defined footer< /td>< /tr>
< /table>
< /xsl:template>

< xsl:template match="form">
< xsl:element name="form">
< xsl:attribute name="method">< xsl:value-of
select="@method"/>< /xsl:attribute>
< xsl:attribute name="action">< xsl:value-of
select="@action"/>< /xsl:attribute>
< xsl:attribute name="name">< xsl:value-of select="@name"/>< /xsl:attribute>
< xsl:attribute name="id">< xsl:value-of select="@id"/>< /xsl:attribute>
< xsl:apply-templates select="*"/>
< /xsl:element>
< /xsl:template>< xsl:template match="*">
< xsl:choose>
< xsl:when test="@transform='blueText'">< xsl:element name="input">
< xsl:attribute name="name">< xsl:value-of select="@name"/>< /xsl:attribute>
< xsl:attribute name="id">< xsl:value-of select="@id"/>< /xsl:attribute>
< xsl:attribute name="type">text< /xsl:attribute>
< xsl:attribute name="style">color:blue< /xsl:attribute>
< xsl:if test="@value">< xsl:attribute name="value">< xsl:value-of
select="@value"/>< /xsl:attribute>< /xsl:if>
< /xsl:element>
< /xsl:when>
< xsl:when test="@transform='redText'">< xsl:element name="input">
< xsl:attribute name="name">< xsl:value-of
select="@name"/>< /xsl:attribute>
< xsl:attribute name="id">< xsl:value-of
select="@id"/>< /xsl:attribute>
< xsl:attribute name="type">text< /xsl:attribute>
< xsl:attribute name="style">color:red< /xsl:attribute>
< xsl:if test="@value">< xsl:attribute name="value">< xsl:value-of
select="@value"/>< /xsl:attribute>< /xsl:if>

< /xsl:element>
< /xsl:when>
< xsl:when test="@transform='bigButton'">< xsl:element name="input">
< xsl:attribute name="name">< xsl:value-of
select="@name"/>< /xsl:attribute>
< xsl:attribute name="id">< xsl:value-of
select="@id"/>< /xsl:attribute>
< xsl:attribute name="style">height:30px;width:100px;font-
size:18pt;font-weight:700;< /xsl:attribute>
< xsl:attribute name="value">< xsl:value-of
select="@value"/>< /xsl:attribute>
< /xsl:element>
< /xsl:when>
< /xsl:choose>
< /xsl:template>
< /xsl:stylesheet>
以上代码无法为你实现创建命名空间、定义XML标签、确认DTD或schema。它使你能够创建可行的HTML脚本，并可转化为完整的新页面，无需担心设计因素。
在样式表中，我用HTML标签的转换属性驱动转换操作。我曾考虑用一个FORM窗体作为定义转换操作所需的用户控件的单元，因为所有用于用户输入的控件都应在一个FORM中。本例中，输出为一个文本INPUT，文本颜色为蓝色；一个高20像素、宽100像素的按钮，字体为18点加粗。我可以通过修改转换属性来改变文本框中的文本颜色。
有多种方法可将静态内容添加到网页中，但出于演示目的，我只采用最简单的方式，即在样式表中增加header和footer。
现在，当我要创建一个新窗体用于用户输入时，我要做的只是创建一个一般窗体。一旦一般窗体通过测试，我就可以将这些窗体添加到转换中生成主题的HTML输出。你只要记住输入控件类型，并注意把它添加为转换属性即可。
达到目的的方法有很多种，通过这个例子，我希望能帮助你们学会如何标准化HTML输出。
本文转自建站学  http://www.jzxue.com ,转载请注明出处。