将XML数据转换成HTM

所属分类: 网页制作 / XML/XSLT 阅读数: 1529
收藏 0 赞 0 分享
使用一个简单的XSL样式表就可以将XML数据转换成HTML。随着XML规范的不断演进,在新的版本中满足每个人的需要似乎已经成为必要;假设有一个表示一个页面内容的XML数据,现在想将其内容转换成布局。下面是想要转换的XML:
<?xmlversion='1.0'?>
<?xml-stylesheettype="text/xsl"href="article.xsl"?>
<xml>
<folders>
<folder>
<text>Folder1</text>
<files>
<file>
<text>File1</text>
<fields>
<field>
<data>
<type>string</type>
<length>50</length>
<value>somedata</value>
</data>
</field>
</fields>
</file>
</files>
</folder>
</folders>
</xml>
这个内容表示一组文件夹、文件和域。每个文件夹包含文件,每个文件包含用于输入数据的域。文件夹组中的每个文件夹都将表现为一个 TABLE 的第一行的一个 TR 元素和一个 TD 元素。文件组中的每个文件都将表示为嵌套在文件夹 TR 元素中的一个 TABLE 元素的第一行的一个 TR 元素和一个 TD 元素。域组中的每个域都将在相关的文件中表现为一个 INPUT。
下面是用于这个转换的 XSL:
<?xmlversion="1.0"?>
<xsl:stylesheet
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"version="1.0"
xmlns:msxsl="urn:schemas-microsoft-com:xslt"
xmlns:fn=http://www.aaa.com/aaa>
<xsl:outputmethod="html"/>
<msxsl:scriptlanguage="JScript"implements-prefix="fn">
functiongetElementCount(nodelist,what){
varrtrn=0;
rtrn=nodelist[0].parentNode.selectNodes(what).length;
return(rtrn 1);//1isaddedforfillerTD
}
</msxsl:script>
<xsl:templatematch="/">
<TABLECELLSPACING="0"CELLPADDING="0"
WIDTH="100%"BORDER="0"ID="tblRoot"NAME="tblRoot"
style="table-layout:fixed;">
<TR>
<xsl:for-eachselect="xml/folders/folder">
<xsl:elementname="TD">
<xsl:attributename="style">width:55px</xsl:attribute>
<xsl:value-ofselect="text"/>
</xsl:element>
</xsl:for-each>
<TD></TD>
</TR>
<xsl:for-eachselect="xml/folders/folder">
<TR>
<xsl:elementname="TD">
<xsl:attributename="colspan">
<xsl:value-ofselect="fn:getElementCount(.,'folder')"/>
</xsl:attribute>

<TABLECELLSPACING="0"CELLPADDING="0"
WIDTH="100%"BORDER="0"style="table-layout:fixed;">
<TR>
<xsl:for-eachselect="files/file">
<xsl:elementname="TD">
<xsl:attributename="style">width:55px;</xsl:attribute>
<xsl:value-ofselect="text"/>
</xsl:element>
</xsl:for-each>
<TD></TD>
</TR>
<xsl:for-eachselect="files/file">
<TR>
<xsl:elementname="TD">
<xsl:attributename="colspan">
<xsl:value-ofselect="fn:getElementCount(.,'file')"/>
</xsl:attribute>
<xsl:for-eachselect="fields/field">
<xsl:elementname="INPUT">
<xsl:attributename="type">text</xsl:attribute>
<xsl:attributename="maxlength">
<xsl:value-ofselect="data/length"/>
</xsl:attribute>
<xsl:attributename="value">
<xsl:value-ofselect="data/value"/>
</xsl:attribute>
</xsl:element><BR/>
</xsl:for-each>
</xsl:element>
</TR>
</xsl:for-each>
</TABLE>
</xsl:element>
</TR>
</xsl:for-each>
</TABLE>
</xsl:template>
</xsl:stylesheet>
在 stylesheet 标记中,设置了几个命名空间,包括定义所有xsl 转换标记的xsl 命名空间。能够让我们创建可以在样式表中使用的用户函数的msxml 命名空间。使用它得到所有的子元素,以便得到一个 TD 标记的一个 COLSPAN 属性集。用于加入一组用户定义的函数的fn 命名空间,该命名空间由msxml:script element 创建。
然后,我们创建外部 TABLE 和第一个 TR。在 TR 中,为 XML 中指定的每个文件夹创建一个 TD。使用了 xsl:element 标记,因为它允许添加自定义属性或者执行一个函数来为另一个 TD 元素中的 COLSPAN 属性设置一个属性。
在为每个文件夹创建了所需的 TD 之后,开始为每个文件夹创建 TR。只向这个TR 添加一个 TD,但是将它的 COLSPAN 属性设为等于文件夹组中文件夹标记的数量再加一。多出的一是用来在一个固定布局样式的 TABLE 中填充空格用的。
为了得到 COLSPAN,传入当前的上下文(在这里由“.”指定)和计算的节点的名字。在函数中,得到当前的上下文,paraentNode,和 XPath 查询中指定的节点的数量。然后函数返回这个数量加上一以填充 TD。
有了这个 TD,在其中嵌入另外一个 TABLE,该 TABLE 包含文件组中的每个文件。从这一点开始,其过程就与外部 TABLE 转换一样。最后的步骤是添加每个文件中的域。
一旦完成了通用布局,就可以开始添加用户界面功能了,比如说隐藏掉其它的文件夹和文件行,直到用户点击了相关的选项卡。这一功能可以通过编写支持这一功能的脚本来实现,添加一个 onclick xsl:attribute 元素到文件夹和文件 TD 元素,然后将它的值设置为脚本函数的名字。
最后,在通用功能完成之后,你可以添加class xsl:attributes 并在 STYLE 或 CSS 中添加相关的classNames 得到你想要的外观。
这个例子为在部署 Web 数据解决方案中用到的 File-Folder-Field 视图创建了一个基础。访问 MSDN 找到更多有关Microsoft 的 XML 规范的信息。
更多精彩内容其他人还在看

WAP教程(2):WAP 基础-XML/XSLT

WAP 的主页与 HTML 的主页非常不同。用于 WAP 的标记语言是 WML (Wireless Markup Language)。WML 使用标签 - 类似 HTML - 但是语法更严格且遵守 XML 1.0 标准。 WAP 主页 W
收藏 0 赞 0 分享

WAP教程(9):WML 实例-XML/XSLT

带有两个卡片的一个卡片组 - 一个供用户输入,一个供显示结果 - 正如本例中展示的. 带有两个卡片的一个卡片组 - 一个供用户输入,一个供显示结果 - 正如本例中展示的: <?xml version="1.0"
收藏 0 赞 0 分享

WAP教程(1):WAP 简介-XML/XSLT

WAP 协议被设计用来在无线客户端(比如移动电话)上展示因特网内容。 WAP 协议被设计用来在无线客户端(比如移动电话)上展示因特网内容。 您应当具备的基础知识 在继续学习之前,您需要对下面的知识有基本的了
收藏 0 赞 0 分享

XML入门教程:XSLT-XML/XSLT

XSLT是XSL的一部份,它是XML的一种应用,指定将一篇XML文档转换成另一种XML文档的规则。XSLT文档即是一篇XML文档,也是一个样式表,里面包含一系列的模板。XSLT处理器对输入XML文档中的元素和样式表中的模板进行比较,如果匹配,则将该模板的内
收藏 0 赞 0 分享

XMLHTTPRequest对象-XML/XSLT

XmlHttp是一套可以在Javascript、VbScript、Jscript等脚本语言中通过http协议传送或从接收XML及其他数据的一套API。XmlHttp最大的用处是可以更新网页的部分内容而不需要刷新整个页面。 1、XMLHTTPReque
收藏 0 赞 0 分享

XML入门教程:CSS样式表-XML/XSLT

样式表可帮我们解释XML文档中各元素的具体意思,所以通过样式表可直接在浏览器上显示XML文档。在XML文档在序言部分通过xml-stylesheet处理指令可指定关联的样式表。xml-stylesheet指令必须有一个href属性和type属性。href指向样式表的URL,typ
收藏 0 赞 0 分享

XML入门教程:XPath-XML/XSLT

XPath是一种用来从文档树中选择节点和节点集的语言。从XPath的角度来看,共有七种节点:根节点、元素节点、属性节点、文本节点、注释节点、处理指令节点、名称空间节点。 XPath是一种用来从文档树中选择节点和节点集的语言。从
收藏 0 赞 0 分享

XML入门教程:XHTM

XHTML是W3C推荐的一种标准,它定义了一种与XML兼容的HTML版本。XHTML文档是一个有效的XML文档,所以编写格式比HTML严格。 XHTML是W3C推荐的一种标准,它定义了一种与XML兼容的HTML版本。XHTML文档是一个有效的XML
收藏 0 赞 0 分享

XML入门教程:XLink-XML/XSLT

XLink是一种基于属性的语法,用来在XML文档中添加链接。XLink链接可以是单向的,如HTML中的A元素,它也可以是双向的,在两个方向上链接两篇文档,因此能够从A到B或从B到A。每个XLink元素必须具有一个xlink:type属性,指出连接类型。属性xlink:h
收藏 0 赞 0 分享

XML入门教程:分析XM

分析XML文档可通过程序来做,分析器有两大类,一种是事件驱动的,一种是基于树模型的。 分析XML文档可通过程序来做,分析器有两大类,一种是事件驱动的,一种是基于树模型的。 使用事件驱动的分析器时,每
收藏 0 赞 0 分享
查看更多