用Javascript读取XML文件的内容并进行分页的问题

来源:互联网 发布:2016淘宝销售额排名榜 编辑:程序博客网 时间:2024/06/07 17:38
    XML数据源对象是一个ActiveX控件,允许你在XML文件和HTML页面之间操作数据。本文将向你展示如何从各种 XML 数据源中提取数据,以及如何使用 Java Script显示这些数据。   

    XML数据源对象DSO是一个微软ActiveX控件,构建在微软IE4以后的版本上。这个对象允许你把一个外部的 XML 文件或者嵌入HTML文件中的内容提取到HTML页面中。

     你可以在一个Web页面中使用XML - DSO从一个外部XML文件中选取内容,从嵌入Web页面的XML中提取 XML 数据,然后使用 Java Script操作这些数据。然而,并不建议在Internet中使用这个对象,因为DSO只能工作在MSIE 4以上的浏览器中,因此这可能会带来一些兼容性问题。 所以,在企业内部网使用 XML -DSO是很合适的。

有index.htm页面,内容如下;
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>XML学习</title>
</head>
<body>
<!--调用XML文件-->
<xml id="myIsland" src="Test.xml"></xml>
<h1 align="center">StudyTest</h1>
<hr />
<table align="center" width="80%" datasrc="#myIsland">
<thead>
        <tr>
                <th>姓名</th>
                <td>职务</td>
                <td>电话</td>
                <th>E_mail</th>
        </tr>
</thead>
<tbody>
        <tr>
                <td><span datafld="name"></span></td>
                <td><span datafld="title"></span></td>
                <td><span datafld="phone"></span></td>
                <td><span datafld="email"></span></td>
        </tr>
</tbody>
</table>
</body>
</html>

读取的Test.xml文件内容如下:
<?xml version="1.0" encoding="gb2312"?>
<directory>
<employee>
  <name>Fred Brown</name>
  <title>softWare</title>
  <phone>(010)-63426229</phone>
  <email>spank168@sina.com</email>
</employee>
  <employee>
    <name>Fred Brown</name>
    <title>softWare</title>
    <phone>(010)-63426229</phone>
    <email>spank168@sina.com</email>
  </employee>
  <employee>
    <name>Fred Brown</name>
    <title>softWare</title>
    <phone>(010)-63426229</phone>
    <email>spank168@sina.com</email>
  </employee>
  <employee>
    <name>Fred Brown</name>
    <title>softWare</title>
    <phone>(010)-63426229</phone>
    <email>spank168@sina.com</email>
  </employee>
  <employee>
    <name>北京</name>
    <title>softWare</title>
    <phone>(010)-63426229</phone>
    <email>spank168@sina.com</email>
  </employee>
  <employee>
    <name>北京</name>
    <title>softWare</title>
    <phone>(010)-63426229</phone>
    <email>spank168@sina.com</email>
  </employee>
  <employee>
    <name>北京</name>
    <title>softWare</title>
    <phone>(010)-63426229</phone>
    <email>spank168@sina.com</email>
  </employee>
  <employee>
    <name>北京</name>
    <title>softWare</title>
    <phone>(010)-63426229</phone>
    <email>spank168@sina.com</email>
  </employee>
  <employee>
    <name>上海</name>
    <title>softWare</title>
    <phone>(010)-63426229</phone>
    <email>spank168@sina.com</email>
  </employee>
  <employee>
    <name>上海</name>
    <title>softWare</title>
    <phone>(010)-63426229</phone>
    <email>spank168@sina.com</email>
  </employee>
  <employee>
    <name>上海</name>
    <title>softWare</title>
    <phone>(010)-63426229</phone>
    <email>spank168@sina.com</email>
  </employee>
  <employee>
    <name>上海</name>
    <title>softWare</title>
    <phone>(010)-63426229</phone>
    <email>spank168@sina.com</email>
  </employee>
</directory>

现在我想在index.htm中使用JavaScript来读取Test.xml的内容,并把他们进行分页处理,比如每页显示4条数据,分3页显示。

Code:
<html>
<
head>
<
meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<
title>XML学习</title>
</
head>
<
body>
<!--
调用XML文件-->
<
xml id="myIsland" src="Test.xml"></xml>
<
h1 align="center">StudyTest</h1>
<
hr />
<
table id="tab1" align="center" width="80%" datapagesize="3" datasrc="#myIsland">
<
thead>
        <
tr>
                <
th>姓名</th>
                <
td>职务</td>
                <
td>电话</td>
                <
th>E_mail</th
        </
tr>
</
thead>
<
tbody>
        <
tr>
                <
td><span datafld="name"></span></td>
                <
td><span datafld="title"></span></td>
                <
td><span datafld="phone"></span></td>
                <
td><span datafld="email"></span></td>
        </
tr>
</
tbody>
</
table>
<
a href="#" onclick="document.getElementById('tab1').previousPage()">上一页</a>
<
a href="#" onclick="document.getElementById('tab1').nextPage()">下一页</a>
</
body>
</
html
原创粉丝点击