HTML中不仅含有大量的格式化语句,还到处充斥着内容数据,让人看着实在是头大。美工人员在调整界面布局时,可能会不经意的修改了内容数据;业面内容维护人员在维护数据时往往也无意的弄乱了业面布局代码。
于是乎,人们开始有意识的避免这种混乱局势。利用XML进行数据描述,在HTML中仅保留页面布局代码,这样就使得数据在界面分开,再也不会因为修改布局而丢失内容数据;亦不会在维护数据时改变页面布局。
数据与界面被分离开了,我们似乎还需要某种手段再让它们有机的结合起来。XML数据配合不同的HTML,可以给客户不同的数据浏览方式。XML数据岛就可以将XML中的数据很自然的引入到HTML中,而无需编写繁琐的代码。
下面我用实例向大家阐述。
假设我们有一个名为“Book.xml”的XML文件存图书信息,内容如下。
<books>
<bookid="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>
<bookid="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>
<bookid="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中引用。定义代码如下:
一般性的,我们会将这句代码写在<Body>标记中。ID是其标识符,方便在HTML文件其他地方引用,src是XML数据文件的位置,可以是相对位置,也可以是一个有效的URL。在此例中是其值是“Test07.xml”,表示这是与该HTML文件存放在同一位置的一个名为“Test07.xml”的文件。
<thead>
<thstyle="font-style:blod">书名</th>
<thstyle="font-style:blod">类别</th>
<thstyle="font-style:blod">书号</th>
<thstyle="font-style:blod">作者</th>
<thstyle="font-style:blod">出版社</th>
<thstyle="font-style:blod">定价</th>
<thstyle="font-style:blod">数量</th>
<thstyle="font-style:blod">余量</th>
</thead>
<tr>
<td><spandatafld="title"></span></td>
<td><spandatafld="bookcategory"></span></td>
<td><spandatafld="isbn"></span></td>
<td><spandatafld="author"></span></td>
<td><spandatafld="publisher"></span></td>
<td><spandatafld="price"></span></td>
<td><spandatafld="amount"></span></td>
<td><spandatafld="remain"></span></td>
</tr>
</table>
大家可以发现,在<table>标记中,我们加入了datasrc="#XMLData",表示该表格的数据来自一个名为“XMLData”的数据岛,特别需要注意的是,在引用数据导时一定要用“#”加上数据岛ID。
同时需要在每个单元格<td>标记中放置一个<span>标记并指定字段,如<td><span datafld="title"></span></td>,表示这个标记与title字段进行绑定,该字段值会自动的填充到<span>标记中。
版权声明:本文为博主原创文章,未经博主允许不得转载。
相关推荐
XML数据岛,全称为XML Data Islands,是一种在客户端利用JavaScript和XML进行数据处理的技术,它允许Web页面直接访问和操作嵌入HTML中的XML数据。在本主题“XML分页排序数据岛”中,我们将深入探讨如何利用XML数据岛...
在实际项目中,应根据需求选择合适的技术栈,如现代前端框架(React, Vue, Angular等)提供的数据绑定机制,它们在很多方面已经取代了XML数据岛的功能,但理解XML数据岛的概念和技术仍然是提升开发者技能的重要一环...
总之,客户端的XML数据岛绑定和模糊查询是一种实用的技术,它允许我们在不频繁交互服务器的情况下实现动态的数据展示和查询,提高应用程序的响应速度。同时,通过JavaScript的DOM操作和自定义函数,我们可以实现各种...
XML数据岛技术是一种将XML(eXtensible Markup Language)文档嵌入到HTML(HyperText Markup Language)页面中的方法,以此实现数据的显示和处理。XML作为一种结构化数据语言,相比HTML具有更强的结构和语义特性,...
**6.1 数据岛、XML数据源对象与数据绑定** 1. **数据岛(Data Island)**:是指将XML数据嵌入到HTML文档中,形成扩展标识语言(XMI)的嵌入部分。数据岛使得XML数据可以直接在HTML环境中使用,而无需通过网络请求获取...
数据岛(Data Islands)是一种在HTML中嵌入XML数据的技术,它允许网页开发者将结构化的数据与HTML元素关联,提供了一种在Web页面上展示和操作复杂数据的有效方式。Mozilla Firefox作为一款开源、免费的网络浏览器,...
内嵌式数据岛是将 XML 数据直接嵌入到 HTML 文档中,而引入式数据岛是将 XML 数据存放到一个独立的 XML 文件中,然后在 HTML 文档中通过语句调用引入。 在 HTML 文档中,数据岛可以通过 DATASRC 属性来绑定数据源...
通过研究和优化数据岛的实现,Firefox旨在提供一个与XML数据交互的统一、高效的方式,以便开发者能够编写兼容更多浏览器的代码。 在实现数据岛的过程中,可能涉及到的技术包括: 1. **XMLHttpRequest**:用于异步从...
6. XML 数据岛绑定于标签( B )之间。 答案:B. <xml></xml> 知识点:在 XML 中,数据岛(Data Island)是指在 HTML 文档中嵌入的 XML 数据,通常使用 <xml> 标签来标记 XML 数据岛。 7. 如果( D ),则 EOF ...
XML数据岛是一个嵌入在HTML页面中的XML片段,可以通过`<XML>`标签定义。然后,通过`datasrc`和`datafld`属性将数据绑定到HTML元素,如`<SPAN>`、`<DIV>`等。例如,以下代码展示了如何使用DSO提取XML数据岛中的姓名和...
XML数据岛: "xml数据岛测验.doc"可能包含了关于如何在HTML页面中嵌入和访问XML数据的题目。XML数据岛是将XML数据集成到HTML或ASP.NET页面中的技术,通过JavaScript或VBScript可以直接在客户端处理XML数据。 XML...
XML数据岛是这种技术融合的产物,它使用<XML>标签把XML数据直接嵌入到HTML页面中,从而实现了二者的优势互补。IE中的数据岛处理方式是使用DSO(Data Source Objects,数据源对象)技术,用Java Applet实现。在IE 5.0...
【AJAX获取XML节点的方法】 在Web开发中,AJAX...4. 在网页中动态展示XML数据的方法,如通过数据岛和HTML属性绑定。 掌握这些知识点,开发者可以有效地构建动态、交互性强的Web应用程序,提高用户体验。
由于XML数据岛和DMO技术主要基于早期的IE浏览器,因此可能存在跨浏览器兼容性问题,现代Web开发更倾向于使用AJAX(Asynchronous JavaScript and XML)或者现在流行的前端框架如React、Vue等,它们提供了更强大且兼容...
通过无效地模拟功能集合,XMLDOM,XMLHTTP,XML数据岛和数据绑定,再次可耻地赢得了第一次浏览器大战。 用法 < script src =" explorerism.js " data-globalize-named-elements =" oNamedElement, txtTextBox " ...
在HTML中嵌入XML数据岛,通常是为了在网页上动态展示XML数据,这涉及到DOM(文档对象模型)和数据绑定的概念。在这个问题中,你想要从XML文件中获取`resume`元素下的`name`子元素,并将其显示在HTML表格中。下面我们...
XML数据岛是HTML中嵌入XML数据的一种方法,允许将XML数据作为数据源嵌入在HTML页面中。 XML数据绑定是将XML文档中的数据与应用程序中的对象直接关联的过程。数据绑定可以使用代码生成器自动完成,也可以手动实现。 ...