A detailed introduction to how to use XML data source objects in web design

黄舟
Release: 2017-03-07 16:14:28
Original
1417 people have browsed it

The xml data source object is an ActiveX control that allows you to manipulate data between XML files and HTML pages. This article will show you how to extract data from various XML data sources and how to display this data using JavaScript.

XML Data Source Object DSO is a Microsoft ActiveX control, built on Microsoft IE4 and later versions. This object allows you to extract the content of an external XML file or embedded HTML file into an HTML page.

You can use XML in a Web page - DSO selects content from an external XML file, extracts XML data from the XML embedded in the Web page, and then uses Javascript to manipulate the data. However, it is not recommended to use this object on the Internet, because DSO can only work in browsers above MSIE 4, so this may cause some compatibility issues. Therefore, it is very appropriate to use XML-DSO in the intranet.

Start

To initialize the XML-DSO object, we use the tag. The CLASSID used for XML-DSO is:

    CLSID:550dda30-0541-11d2-9ca9-0060b0ec3d39
Copy after login

This ID uniquely identifies XML-DSO. Use the following code to initialize this control in a Web page:

  <OBJECT ID="SomeID" CLASSID="CLSID:550dda30-0541-11d2-9ca9-0060b0ec3d39"></OBJECT>
Copy after login

Although most objects require many parameters to be associated with them, XML-DSO does not require any parameters.

Extracting data using an XML data island

First, include an XML data island by using the tag. Second, assign it an ID, xmldb -- for later use. The data is actually extracted using HTML tags: , ,

, etc. The code in Listing 1 uses the tag. The datasrc attribute specifies the data island from which you want to extract data. The datafld attribute specifies the XML markup of the data you want. So, the first extracts the name, and the second extracts the gender.

Code Listing 1:

<!-- example1.htm -->
<html>
<head>
<title>XML DSO-example1.htm</title>
</head>
<body bgcolor="#FFFFFF">
<xml id="xmldb">
<db>
<member>
<name>PRemshree Pillai<name>
<sex>male</sex>
</member>
<member>
<name>Vinod</name>
<sex>male</sex>
</member>
</db>
</xml>

<span datasrc="#xmldb" datafld="name"<</span>
<br>
<span datasrc="#xmldb" datafld="sex"></span>

</body>
</html>
Copy after login

Note that this code does not initialize an XML-DSO object. This is because the use of XML data islands has implicitly created one. The output should be:
 
 

Premshree Pillai
  male
Copy after login

Note that there are two and tags in the XML data island. Using this method, you can only extract the first instance of these tags. The code in Listing 2 uses the

tag to extract all instances:

The output will be:

NameSex
Premshree Pillaimale
Vinodmale
在代码列表2中,<TABLE>标记使用<TD>标记内的<DIV>标记提取数据。表格将自动重复<member>(<name>和<sex>的母标记)的每个实例。

  代码列表2:

<!-- example2.htm -->
<html>
<head>
<title>XML DSO-example2.htm</title>
</head>
<body bgcolor="#FFFFFF">

<xml id="xmldb">
<db>
<member>
<name>Premshree Pillai<name>
<sex>male</sex>
</member>
<member>
<name>Vinod</name>
<sex>male</sex>
</member>
</db>
</xml>

<table datasrc="#xmldb" border="1">
<thead>
<th>Name</th>
<th>Sex</th>
</thead>
<tr>
<td><div datafld="name"></div></td>
<td><div datafld="sex"></div></td>
</tr>
</table>

</body>
</html>
Copy after login

使用外部XML文件提取数据

  为了使用XML-DSO加载一个外部XML文件,你必须显式的包含这个对象并且使用一些JavaScript。

  首先创建一个XML-DSO对象,使用ID myXML。添加宽度和高度属性到<OBJECT>标记中,然后设置它们的值为0。这保证XML-DSO对象不会占据你的Web页面的任何空间。

  其次,使用datasrc创建一个象myXML一样的表--类似于代码列表2中一样。代码使用<DIV>标记(在TD标记之)提取数据,使用datafld作为第一栏的信息,并且使用URL作为第二栏。添加<SCRIPT>标记,因为在这里,外部的XML使用Java脚本显式地声明你想要加载的XML文件。

  设置变量xmlDso为myXML.XMLDocument。myXML引用你已经创建的对象。接下来,使用XML-DSO的load()方法加载example3.xml。文件example3.xml连接到对象myXML上。

<!-- example3.xml -->
<?xml version="1.0" ?>
<ticker>
<item>
<message>JavaScript Ticker using XML DSO</message>
<URL>http://someURL.com</URL>
</item>
</ticker>
Copy after login

  现在,研究一下下面的HTML页面:

<!-- example3.htm -->
<html>
<head>
<title>XML DSO-example3.htm</title>
<script language="JavaScript">
function load() {
var xmlDso=myXML.XMLDocument;
xmlDso.load("example3.xml");
}
</script>
</head>
<body bgcolor="#FFFFFF" onLoad="load()">

<object id="myXML" CLASSID="clsid:550dda30-0541-11d2-9ca9-0060b0ec3d39" 
width="0" height="0"></object>

<table datasrc="#myXML" border="1">
<thead>
<th>Message</th>
<th>URL</th>
</thead>
<tr>
<td><div datafld="message"></div></td>
<td><div datafld="URL"></div></td>
</tr>
</table>

</body>
</html>
Copy after login

输出应是:

Message URL
   JavaScript Ticker using XML DSO http://someURL.com
Copy after login

上面的脚本非常特殊化。下面给出一个更一般的脚本:

<script language="JavaScript">
var xmlDso;
function load(xmlFile, objName) {
eval('xmlDso='+objName+'.XMLDocument');
xmlDso.load(xmlFile);
}
</script>
Now, to load any XML file use: 
load("SomeXMLFile.xml","anyXmlDsoObject");
Copy after login

使用XML-DSO和JavaScript

  假设你有一个包含姓名、电子邮件地址和电话号码的XML文件。你想使用它构建一个应用程序,显示每个人的档案--一次显示一个。用户将使用"Next"和"Previous"按钮浏览每个人的数据。Javascript可以帮助你实现这个目的。

  下面的代码使用记录集方法把文件中所有的数据保存到一个变量memberSet中。moveNext()方法指向下一个数据项(下一行)。脚本然后载入XML文件example4.xml,把记录保存到变量memberSet中。第一个记录将被显示,但是memberSet.moveNext()指向文件中相对于前一个指定数据的下一个记录。

<!-- example4.xml -->
<?xml version="1.0" ?>
<myDB>
<member>
<name>Premshree Pillai</name>
<sex>male</sex>
</member>
<member>
<name>Vinod</name>
<sex>male</sex>
</member>
<member>
<name>Santhosh</name>
<sex>male</sex>
</member>
</myDB>
Copy after login
Copy after login

  这里是相应的HTML文件:

<!-- example4.htm -->
<html>
<head>
<title>XML DSO-example4.htm</title>
<script language="JavaScript">
function load() {
var xmlDso=myDB.XMLDocument;
xmlDso.load("example4.xml");

/* Get the complete record set */
var memberSet=myDB.recordset;

/* Go to next data */
memberSet.moveNext();
}
</script>
</head>
<body bgcolor="#FFFFFF" onLoad="load()">

<object id="myDB" CLASSID="clsid:550dda30-0541-11d2-9ca9-0060b0ec3d39" 
width="0" height="0"></object>

<span datasrc="#myDB" datafld="name"></span>

</body>
</html>
Copy after login
Copy after login

输出应是:

Vinod
Copy after login

  下面给出更多使用JavaScript操作XML-DSO的方法:

· movePrevious(): 指向前一个数据项。

   · moveFirst(): 指向第一个数据项。

   · moveLast(): 指向最后一个数据项。

   · EOF: 这个属性用来检测我们是否已经到达数据记录的底部。

使用XML-DSO和JavaScript

  假设你有一个包含姓名、电子邮件地址和电话号码的XML文件。你想使用它构建一个应用程序,显示每个人的档案--一次显示一个。用户将使用"Next"和"Previous"按钮浏览每个人的数据。Javascript可以帮助你实现这个目的。

  下面的代码使用记录集方法把文件中所有的数据保存到一个变量memberSet中。moveNext()方法指向下一个数据项(下一行)。脚本然后载入XML文件example4.xml,把记录保存到变量memberSet中。第一个记录将被显示,但是memberSet.moveNext()指向文件中相对于前一个指定数据的下一个记录。

<!-- example4.xml -->
<?xml version="1.0" ?>
<myDB>
<member>
<name>Premshree Pillai</name>
<sex>male</sex>
</member>
<member>
<name>Vinod</name>
<sex>male</sex>
</member>
<member>
<name>Santhosh</name>
<sex>male</sex>
</member>
</myDB>
Copy after login
Copy after login

  这里是相应的HTML文件:

<!-- example4.htm -->
<html>
<head>
<title>XML DSO-example4.htm</title>
<script language="JavaScript">
function load() {
var xmlDso=myDB.XMLDocument;
xmlDso.load("example4.xml");

/* Get the complete record set */
var memberSet=myDB.recordset;

/* Go to next data */
memberSet.moveNext();
}
</script>
</head>
<body bgcolor="#FFFFFF" onLoad="load()">

<object id="myDB" CLASSID="clsid:550dda30-0541-11d2-9ca9-0060b0ec3d39" 
width="0" height="0"></object>

<span datasrc="#myDB" datafld="name"></span>

</body>
</html>
Copy after login
Copy after login

  输出应是:

   Vinod
Copy after login

 下面给出更多使用JavaScript操作XML-DSO的方法:

   · movePrevious(): 指向前一个数据项。

   · moveFirst(): 指向第一个数据项。

   · moveLast(): 指向最后一个数据项。

   · EOF: 这个属性用来检测我们是否已经到达数据记录的底部。

  initTicker()首先检查是否有IE 4+。如果浏览器是IE4+,这个XML文件被作为一个参数被传递并载入。如果定时器失败了,那么调用xmlDsoTicker()函数。xmlDsoTicker()除了xmlFile参数以外,和initTicker()有相同的参数,因为XML文件已经被载入。xmlDsoTicker()检查变量counter(初始值为maxMsgs)是否小于maxMsgs-1。如果是,moveNext()方法指向tickerSet中下一个数据项。

  HTML页面的BODY包含下面的代码:

<a href="" datasrc="#ticker" datafld="URL" class="tickerStyle">
<span datasrc="#ticker" datafld="message"></span>
</a>
Copy after login

图1:定时器应用程序显示输出。

  在这段代码中,<A>标记把XML文件的URL作为它的datafld。<SPAN>标记把XML文件的信息作为它的datafld。这个信息在<SPAN>元素中显示,然后整个信息可以通过这段信息相应的URL连接。 

  这样,<A>和<SPAN>元素包含下一个数据项(URL和信息)。在一段延迟以后,<A>和<SPAN>指向下一个数据。只要counter<maxMsgs-1(计数器每次递增),这个操作就会发生。如果counter<maxMsgs-1是假,计数器就被设置为0,然后指向tickerSet中的第一个数据项。 

 以上就是Web设计中如何使用XML数据源对象详细介绍的内容,更多相关内容请关注PHP中文网(www.php.cn)!


Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!