XML 数据岛之一数据绑定

最新推荐文章于 2019-06-11 17:24:00 发布

禹爸爸

最新推荐文章于 2019-06-11 17:24:00 发布

阅读量3.5k

点赞数

分类专栏： XML 文章标签： xml html 出版 books table 数据结构

本文链接：https://blog.csdn.net/chris_mao/article/details/1825375

版权

XML 专栏收录该内容

13 篇文章 0 订阅

订阅专栏

HTML中不仅含有大量的格式化语句，还到处充斥着内容数据，让人看着实在是头大。美工人员在调整界面布局时，可能会不经意的修改了内容数据；业面内容维护人员在维护数据时往往也无意的弄乱了业面布局代码。

于是乎，人们开始有意识的避免这种混乱局势。利用XML进行数据描述，在HTML中仅保留页面布局代码，这样就使得数据在界面分开，再也不会因为修改布局而丢失内容数据；亦不会在维护数据时改变页面布局。

数据与界面被分离开了，我们似乎还需要某种手段再让它们有机的结合起来。XML数据配合不同的HTML，可以给客户不同的数据浏览方式。XML数据岛就可以将XML中的数据很自然的引入到HTML中，而无需编写繁琐的代码。

下面我用实例向大家阐述。

假设我们有一个名为“Book.xml”的XML文件存图书信息，内容如下。

<? xml version="1.0" encoding="gb2312" ?>

< books >

< book id ="0001" bookcategory ="文艺" amount ="150" remain ="80" discount ="8.7" >

< title > 三国演义 </ title >

< author > 罗贯中 </ author >

< publisher > 文艺出版社 </ publisher >

< isbn > 0-765-58007-8 </ isbn >

< price > 80 </ price >

</ book >

< book id ="0002" bookcategory ="文艺" amount ="100" remain ="70" discount ="9.8" >

< title > 红楼梦 </ title >

< author > 曹雪芹 </ author >

< publisher > 三秦出版社 </ publisher >

< isbn > 0-765-58007-9 </ isbn >

< price > 22 </ price >

</ book >

< book id ="0003" bookcategory ="文艺" amount ="120" remain ="60" discount ="8.5" >

< title > 西游记(上下册) </ title >

< author > 吴承恩 </ author >

< publisher > 人民文学出版社 </ publisher >

< isbn > 0-765-58007-3 </ isbn >

< price > 40.12 </ price >

</ book >

</ books >

每个图书结点(Book)都有分类，数据，余量，折扣四个属性，还有书名，作者，出版社，书号和价格五个子元素。这里仅仅是为了给大家讲述如何使用XML数据岛，故数据结构定义的很简单，数据量也不是很大。

我们想在HTML中以表格的形式，将XML中的内容显示出来。我们现在开始动手编写HTML文件。首先要在HTML中构造一个表格，用来显示图书的信息。这部分想必大家都很梳洗，我就不细讲了，我们着重的讲一下如何定义XML数据导，以及如何将数据表HTML表格进行绑定。

XML数据岛，顾名思义，它充当着数据源的作用，就是引入存储数据的XML文件，并为其分配一个ID，方便在HTML中引用。定义代码如下：

< xml id ="XMLData" src ="Test07.xml" ></ xml >

一般性的，我们会将这句代码写在<Body>标记中。ID是其标识符，方便在HTML文件其他地方引用，src是XML数据文件的位置，可以是相对位置，也可以是一个有效的URL。在此例中是其值是“Test07.xml”，表示这是与该HTML文件存放在同一位置的一个名为“Test07.xml”的文件。

< table id ="tblbooks" datasrc ="#XMLData" border =1 datapagesize =2 width ="100%" >

< thead >

< th style ="font-style: blod" > 书名 </ th >

< th style ="font-style: blod" > 类别 </ th >

< th style ="font-style: blod" > 书号 </ th >

< th style ="font-style: blod" > 作者 </ th >

< th style ="font-style: blod" > 出版社 </ th >

< th style ="font-style: blod" > 定价 </ th >

< th style ="font-style: blod" > 数量 </ th >

< th style ="font-style: blod" > 余量 </ th >

</ thead >

< tr >

< td >< span datafld ="title" ></ span ></ td >

< td >< span datafld ="bookcategory" ></ span ></ td >

< td >< span datafld ="isbn" ></ span ></ td >

< td >< span datafld ="author" ></ span ></ td >

< td >< span datafld ="publisher" ></ span ></ td >

< td >< span datafld ="price" ></ span ></ td >

< td >< span datafld ="amount" ></ span ></ td >

< td >< span datafld ="remain" ></ span ></ td >

</ tr >

</ table >

大家可以发现，在<table>标记中，我们加入了datasrc="#XMLData"，表示该表格的数据来自一个名为“XMLData”的数据岛，特别需要注意的是，在引用数据导时一定要用“＃”加上数据岛ID。

同时需要在每个单元格<td>标记中放置一个<span>标记并指定字段，如<td><span datafld="title"></span></td>，表示这个标记与title字段进行绑定，该字段值会自动的填充到<span>标记中。

禹爸爸

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录