分享
 
 
 

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

王朝html/css/js·作者佚名  2008-05-31
窄屏简体版  字體: |||超大  

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="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输出。你只要记住输入控件类型,并注意把它添加为转换属性即可。

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
2023年上半年GDP全球前十五强
 百态   2023-10-24
美众议院议长启动对拜登的弹劾调查
 百态   2023-09-13
上海、济南、武汉等多地出现不明坠落物
 探索   2023-09-06
印度或要将国名改为“巴拉特”
 百态   2023-09-06
男子为女友送行,买票不登机被捕
 百态   2023-08-20
手机地震预警功能怎么开?
 干货   2023-08-06
女子4年卖2套房花700多万做美容:不但没变美脸,面部还出现变形
 百态   2023-08-04
住户一楼被水淹 还冲来8头猪
 百态   2023-07-31
女子体内爬出大量瓜子状活虫
 百态   2023-07-25
地球连续35年收到神秘规律性信号,网友:不要回答!
 探索   2023-07-21
全球镓价格本周大涨27%
 探索   2023-07-09
钱都流向了那些不缺钱的人,苦都留给了能吃苦的人
 探索   2023-07-02
倩女手游刀客魅者强控制(强混乱强眩晕强睡眠)和对应控制抗性的关系
 百态   2020-08-20
美国5月9日最新疫情:美国确诊人数突破131万
 百态   2020-05-09
荷兰政府宣布将集体辞职
 干货   2020-04-30
倩女幽魂手游师徒任务情义春秋猜成语答案逍遥观:鹏程万里
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案神机营:射石饮羽
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案昆仑山:拔刀相助
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案天工阁:鬼斧神工
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案丝路古道:单枪匹马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:与虎谋皮
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:李代桃僵
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:指鹿为马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:小鸟依人
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:千金买邻
 干货   2019-11-12
 
推荐阅读
 
 
 
>>返回首頁<<
 
靜靜地坐在廢墟上,四周的荒凉一望無際,忽然覺得,淒涼也很美
© 2005- 王朝網路 版權所有