XML和XSLT结合使网站设计浑然一体
来源:互联网 发布时间:2008-09-05 17:13:00
XML和XSLT的转换使Web设计受益无穷。借助XML和 XSLT转换,你可以实现将动态用语(dynamic verbiage)和网站内容存储在数据库中。你可以在XML中传输数据库,然后再通过XSLT转换将其转变为HTML脚本。
在网络发展初期,凝聚性(cohesiveness)是由服务器端实现的,但要牵涉到大量的人工文件管理工作。幸运的是,随着网络的日益成熟,网络开发工具也日臻完善。例如,在.NET框架下,你可以创建各种Web控件来统一设计。
在设计用户/数据交互功能时,如何让数据的完整性、用户界面的功能性和商务规则的完善实现。本文将提供一个网站实例,并说明XML 和XSLT如何使你的网站设计浑然一体。
以下是引用片段:
<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="http://www.knowsky.com/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="http://www.knowsky.com/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输出。你只要记住输入控件类型,并注意把它添加为转换属性即可。


猜你喜欢
- 一、正则表达式的作用提示:正则表达式是一段特殊的字符串,它表示的是一段有规律的信息。如果我们想从一段文字中提取想要的内容,就可以通过正则表达
- 遵循Web标准的思想,网页要表现出一种亲和力。那么,针对残障用户来说,其“阅读”器可不能读取图像上传递的信息的。所以我们会采用一种Using
- 某日,一同学给小的发了 Github 源码,说是可以轻松查到删除自己的微信好友,于是就开始了作死之路。Github 源码请看:0x5e/we
- 如下:counter.htm<a href=counter.asp?save=123&url=http://127.0.0
- 开门见山,直接以例子介绍: 代码如下:CREATE TABLE [dbo].[course]( [id] [int] NULL,
- 本文实例讲述了JS实现动画兼容性的transition和transform方法。分享给大家供大家参考,具体如下:今天在开发纯手工js打造图片
- 一、TensorBoardTensorBoard 一般都是作为 TensorFlow 的可视化工具,与 TensorFlow 深度集成,它能
- 在access中进行时间的比较sql语句很简单,如select * from table where thetime>#\"
- 描述:下午快下班的时候公司供应链部门的同事跑过来问我能不能以程序的方法帮他解决一些excel表格每周都需要手工重复做的事情,Excel 是数
- v-model的基本用法一、本节说明前面的章节我们学习了v-bind指定,可以通过模型数据去影响视图。我们都知道VUE是支持双向数据绑定的,
- MySQL超长字符截断又名"SQL-Column-Truncation",是安全研究者Stefan Esser在2008
- 虽然现在有许多网页制作工具能让您轻松地完成工作,但如果使用HTML则可以得到更大控制权,下面介绍几个小技巧。1.使用语句来控制文字排版比用好
- 非常好的一篇技术文档,翻译自Louis Lazaris 2009年9月15日发表的《The Z-Index CSS Property: A
- python txt中的文件,逐行读取并且每行赋值给变量最近想做自动化,想到可能会用到很多账号密码,所以想到了用参数化,但是一个用户,一个密
- 1.INSERT INTO SELECT语句 语句形式为:Insert into Table2(field1,field2,...) sel
- 先来看一下Spring官网首页的一个图片滑动显示效果可以看到, 随着鼠标的滑动,绿色图片和灰色图片可以无缝的在鼠标俩两边切换显示。显示这样的
- 元字符(Meta Characters)是正则表达式中具有特殊意义的专用字符,在Python中也不例外,是用来指明前导字符(位于元字符前的字
- 代码及注释如下#Auther Bob#--*--conding:utf-8 --*--#生产者消费者模型,这里的例子是这样的,有一个厨师在做
- python类class定义及其初始化定义类,功能,属性一般类名首字母大写class Calculator:#名字和价格是属性
- 1、ndarray转换成matriximport numpy as npfrom numpy import random,matr_arr=