This chapter demonstrates a small framework for an XML application.
本章将介绍如何为XML应用程序书写一个小框架。

Note: This example uses a Data Island, which only works in Internet Explorer.
注意：这个案例使用了数据岛，它仅在IE中使用。

The XML Example Document
XML案例文档

Look at the following XML document ("cd_catalog.xml"), that represents a CD catalog:
请看下面的XML文档("cd_catalog.xml")，它列举了一份CD目录：

<?xml version="1.0" encoding="ISO-8859-1"?>
<CATALOG>
 <CD>
 <TITLE>Empire Burlesque</TITLE>
 <ARTIST>Bob Dylan</ARTIST>
 <COUNTRY>USA</COUNTRY>
 <COMPANY>Columbia</COMPANY>
 <PRICE>10.90</PRICE>
 <YEAR>1985</YEAR>
 </CD>
.
.
... more ...
.

View the full "cd_catalog.xml" file in your browser
使用浏览器里查看完整的 "cd_catalog.xml" 文件

Load the XML Document Into a Data Island
把XML文档载入数据岛

A Data Island can be used to access the XML file.
数据岛可用于访问XML文件。

To get your XML document "inside" an HTML page, add an XML Data Island to the HTML page:
要在HTML页面中获取XML文档，必须向HTML页面中添加一个XML数据岛：

<xml src="cd_catalog.xml" id="xmldso" async="false">
</xml>

With the example code above, the XML file "cd_catalog.xml" will be loaded into an "invisible" Data Island called "xmldso". The async="false" attribute is added to make sure that all the XML data is loaded before any other HTML processing takes place
通过上述案例中的代码，XML文件 "cd_catalog.xml" 会被载入一个“可见”的数据岛，该数据岛叫做“xmldso”。async="false" 属性设置是为了在所有其它的HTML处理过程发生之前，确保所有的XML数据都已被加载。

Bind the Data Island to an HTML Table
把数据岛绑定到HTML表格中

To make the XML data visible on the HTML page, you must "bind" the Data Island to an HTML element.
为了使XML数据在HTML页面上可见，你必须把数据岛绑定到一个HTML的元素中。

To bind the XML data to an HTML table, add a datasrc attribute to the table element, and add datafld attributes to the span elements inside the table data:
将数据岛绑定到HTML表格中，并为表格元素添加一个“datasrc” 属性，同时为表格数据内的“span” 元素添加“datafld” 属性：

<table datasrc="#xmldso" width="100%" border="1">

<thead>
<th>Title</th>
<th>Artist</th>
<th>Year</th>
</thead>

<tr align="left">
<td><span datafld="TITLE"></span></td>
<td><span datafld="ARTIST"></span></td>
<td><span datafld="YEAR"></span></td>
</tr>

</table>

If you have IE 5.0 or higher: See how the XML data is displayed inside an HTML table.
如果你的浏览器是IE5以上的版本： 看看XML数据是如何在HTML表格中显示的。

Bind the Data Island to <span> or <div> Elements
把数据岛绑定到<span>或<div>元素

<span> or <div> elements can be used to display XML data.
<span> 或 <div> 元素可用于显示XML数据。

You don't have to use the HTML table element to display XML data. Data from a Data Island can be displayed anywhere on an HTML page.
你并不一定要使用HTML表格元素来显示XML数据。数据岛中的数据可以在HTML页面的任何地方显示出来。

All you have to do is to add some <span> or <div> elements to your page. Use the datasrc attribute to bind the elements to the Data Island, and the datafld attribute to bind each element to an XML element, like this:
你只须要为页面添加一些<span>或<div>元素。用“datasrc” 属性把元素绑定数据岛，用“datafld” 属性把每个元素绑定到一个XML元素上，如下所示：

<br />Title:
<span datasrc="#xmldso" datafld="TITLE"></span>
<br />Artist:
<span datasrc="#xmldso" datafld="ARTIST"></span>
<br />Year:
<span datasrc="#xmldso" datafld="YEAR"></span>

or like this:
或着：

<br />Title:
<div datasrc="#xmldso" datafld="TITLE"></div>
<br />Artist:
<div datasrc="#xmldso" datafld="ARTIST"></div>
<br />Year:
<div datasrc="#xmldso" datafld="YEAR"></div>

If you have IE 5.0 or higher: See how the XML data is displayed inside the HTML elements.
如果你的浏览器是IE5以上的版本：查阅XML数据是怎样在HTML元素里显示的。

Note that if you use an HTML <div> element, the data will be displayed on a new line.
注意：如果你使用了HTML <div> 元素，那么数据将会显示在新的一行内。

With the examples above, you will only see one line of your XML data. To navigate to the next line of data, you have to add some scripting to your code.
在上述案例中，你只能看到XML数据中的一行；为了对下一行数据进行操作，你必须为你的代码添加一些脚本程序。

Add a Navigation Script
添加一个导航脚本程序

Navigation has to be performed by a script.
通过脚本程序可以实现数据的导航。

To add navigation to the XML Data Island, create a script that calls the movenext() and moveprevious() methods of the Data Island.
为了给数据岛添加导航，可以创立一个脚本程序，名为数据岛的“movenext()” 和“moveprevious()” 方法，具体如下：

<script type="text/javascript">
function movenext()
{
x=xmldso.recordset
if (x.absoluteposition < x.recordcount)
	{
	x.movenext()
	}
}
function moveprevious()
{
x=xmldso.recordset
if (x.absoluteposition > 1)
	{
	x.moveprevious()
	}
}
</script>

If you have IE 5.0 or higher: See how you can navigate through the XML records
如果你的浏览器是IE5以上的版本：查阅XML记录是怎样进行导航的。

All Together Now
现在将所有内容整合在一起

With a little creativity you can create a full application.
只需要一点点创造力，你就可以创建完整的应用程序。

If you use what you have learned on this page, and a little imagination, you can easily develop this into a full application.
你只要在学完本页知识的同时加上一丁点想象力，就可以创建更完整的应用程序。

If you have IE 5.0 or higher: See how you can add a little fancy to this application.
使用IE5以上的版本：看看我们为这个应用程序所做的一些改进。

XML 服务器 XMLHttpRequest 对象

评论 (1) 1 All