今天，在上xml课的时候，吴旻昊在做项目中，需要在网页中直接操作xml文件，我给大家举一个
小案例，希望对各位有帮助:
首先建立一个student.xml文档如下 ,该文档描述了一些学生信息
<?xml version="1.0" encoding="utf-8"?>
<StuList>
<stu id="00恭">
<stuName>张三</stuName>
<stuSex>男</stuSex>
<stuAge>20</stuAge>
<stuGrade>90</stuGrade>
</stu>
<stu id="00喜">
<stuName>李四</stuName>
<stuSex>女</stuSex>
<stuAge>18</stuAge>
<stuGrade>99</stuGrade>
</stu>
<stu id="00发">
<stuName>王五</stuName>
<stuSex>男</stuSex>
<stuAge>22</stuAge>
<stuGrade>50</stuGrade>
</stu>
<stu id="00财">
<stuName>刘六</stuName>
<stuSex>女</stuSex>
<stuAge>17</stuAge>
<stuGrade>80</stuGrade>
</stu>
</StuList>
我要达到的效果是通过点击下一个学生按钮，和上一个学生，可以显示不同的学生
现在，我写一个testXml.html文件，去访问student.xml文件,testXml.html文件如下:
<html>
<head>
<script language="JavaScript">
<!--
var i = -1;
//创建一个active对象
var StuDoc = new ActiveXObject("MSXML2.DOMDocument.3.0");
//加载xml文件
StuDoc.load("student.xml");
//选中节点
var items = StuDoc.selectNodes("/StuList/stu");
function getNode(doc, xpath) {
var retval = "";
var value = doc.selectSingleNode(xpath);
if (value) retval = value.text;
return retval;
}
//得到下一个学生
function getNextStu() {
i++;
if (i > items.length - 1) i = 0;
document.forms[0].name.value = getNode(StuDoc, "/StuList/stu[" + i + "]/stuName");
document.forms[0].sex.value = getNode(StuDoc,"/StuList/stu[" + i + "]/stuSex");
document.forms[0].age.value = getNode(StuDoc, "/StuList/stu[" + i + "]/stuAge");
document.forms[0].grade.value = getNode(StuDoc,"/StuList/stu["+ i + "]/stuGrade");
}
//得到前一个学生
function getPreStu() {
i--;
if (i < 0) i = items.length - 1;
document.forms[0].name.value = getNode(StuDoc, "/StuList/stu[" + i + "]/stuName");
document.forms[0].sex.value = getNode(StuDoc,"/StuList/stu[" + i + "]/stuSex");
document.forms[0].age.value = getNode(StuDoc, "/StuList/stu[" + i + "]/stuAge");
document.forms[0].grade.value = getNode(StuDoc,"/StuList/stu["+ i + "]/stuGrade");
}
// -->
</script>
</head>
<body onload="getNextStu()">
<h2>访问学生信息</h2>
<form>
<table border="1">
<tr><td>姓名</td><td><input type="text" name="name"></td></tr>
<tr><td>性别</td><td><input type="text" name="sex"></td></tr>
<tr><td>年龄</td><td><input type="text" name="age"></td></tr>
<tr><td>成绩</td><td><input type="text" name="grade"></td></tr>
</table>
<input type="button" value="上一个学生" onClick="getPreStu();">
<input type="button" value="下一个学生 " onClick="getNextStu();">
</form>
</body>
</html>
如何使用案例: 非常简单，
1：只要将 土色部分 保存为一个student.xml文件，注意文件名不要修改,
如果要修改，则需要在testXml.html文件 //加载xml文件 StuDoc.load("student.xml"); 作对应的修改
2：将绿色部分 保存为testXml.html文件(该文件名可以随意)
3：将student.xml和testXml.html文件放入到同一文件夹下就可以使用了,用ie打开testXml.html就会看到
图一：
图二：
- 大小: 12.5 KB
- 大小: 12 KB
分享到：
相关推荐
<creator id="new" class="uk.ltd.getahead.dwr.create.NewCreator"/>DWR已经将这配置到了内置的dwr.xml文件中,并不需要进行额外的配置. Creator通过调用类的默认的构造方法创建实例.应用new creator有以下几个优点:...
hm-tools-js-css 功能：根据URL请求参数将多个javascript文件合并成一个javascript文件返回...支持替换css文件中url引用资源的相对路径为可访问的绝对路径。支持使用yuicompressor对js，css文件内容进行实时压缩、混淆
在本书附带光盘的“Resource Links”文件夹中名为Appendix.htm的文件中，会找到附录的拷贝。（要了解在计算机上安装Appendix.htm的信息，参见光盘上的Readme文件。）你可以通过在Web浏览器中打开Appendix.htm文件并...
资源不能设置免费，如果没积分，请直接访问官网https://github.com/google/styleguide/blob/gh-pages/intellij-java-google-style.xml
1.3 在Web页面中使用JavaScript 5 1.3.1 HTML的基本结构 5 1.3.2 在HTML中嵌入JavaScript 7 1.3.3 链接JavaScript文件 9 1.4 编写JavaScript的工具 11 1.4.1 使用纯文本编辑器 11 1.4.2 使用专业化脚本编辑工具 13 ...
在本书附带光盘的“Resource Links”文件夹中名为Appendix.htm的文件中，会找到附录的拷贝。（要了解在计算机上安装Appendix.htm的信息，参见光盘上的Readme文件。）你可以通过在Web浏览器中打开Appendix.htm文件并...
1．3 在web页面中使用JavaScript 1．3．1 HTML的基本结构 1．3．2 在HTML中嵌入JavaScript 1．3．3 链接JavaScript文件 1．4 编写JavaScript的工具 1．4．1 使用纯文本编辑器 1．4．2 使用专业化脚本编辑工具 ...
在XML和DTD文件中，第一个定义的都是根元素。 3.Parent Element(父元素)/Child Element(子元素) 父元素是指包含有其它元素的元素，被包含的元素称为它的子元素。看上面的"结构树"，其中是父元素，,是它的子元素，...
13.3.xml 使用XSLT实现“Hello World”的XML文件。 13.4.xsl 使用XSLT实现“Hello World”的XSLT文件。 13.5.html 内嵌的XML数据岛。 13.6.html 外嵌的XML数据岛。 13.7.html 在HTML中显示XML...
JavaScript代码可以访问和操作表示每个文档元素的对象。能够直接访问表示一个文档的内容的对象。这一能力是很强大的。但是这也使事情开始变得复杂起来。 一个文档对象模型或者说DOM就是一个API，它定义了如何访问...
19.14 使用JavaScript加载XML文件 19.15 动态加载JavaScript文件 19.16 防止JavaScript文件被其他站直接引用 19.17 检查机器是否安装Word 19.18 打印当前页 19.19 打印预览 19.20 隐藏不想打印的页面内容 19.21 使用...
文件夹中的文件root/img/logo.png可以通过以下方式访问bundle.read("img/logo.png") == Uint8Array 辅助方法允许用户读取所需的数据格式。 var d = bundle.readJSON("data/file.json") == object var s = bundle....
9.3 JavaScript中Java式的类继承207 9.4 类的扩充210 9.5 类和类型212 9.6 JavaScript中的面向对象技术217 9.7 子类230 9.8 ECMAScript 5 中的类239 9.9 模块248 第10章 正则表达式的模式匹配253 ...
19.14 使用JavaScript加载XML文件 19.15 动态加载JavaScript文件 19.16 防止JavaScript文件被其他站直接引用 19.17 检查机器是否安装Word 19.18 打印当前页 19.19 打印预览 19.20 隐藏不想打印的页面内容 19.21 使用...
在本书附带光盘的“Resource Links”文件夹中名为Appendix.htm的文件中，会找到附录的拷贝。（要了解在计算机上安装Appendix.htm的信息，参见光盘上的Readme文件。）你可以通过在Web浏览器中打开Appendix.htm文件并...
弗兰纳根(David Flanagan)是一名程序员，也是一名作家，他在O’Reilly出版的其他畅销书还包括《JavaScript Pocket Reference》、《The Ruby Programming Language》、以及《Java in a Nutshell》。David毕业于麻省...
avaScript 是目前 Web 应用...另外由于 Windows 对其最为完善的支持并提供二次开发的接口来访问操作系统各 组件并实施相应的管理功能，JavaScript 成为继.bat(批处理文件)以来 Windows 系统里使用最 为广泛的脚本语言。
实例298 在ASP中利用Word自动打印指定格式的会议记录 470 实例299 在PHP中调用Word自动打印指定格式的会议记录 472 11.3 利用Excel打印报表 474 实例300 将Web页面中的数据导出到Excel 474 实例301 将Web页面中的...
他在O’Reilly出版的其他畅销书还包括《JavaScript Pocket Reference》、《The Ruby Programming Language》、以及《Java in a Nutshell》。David毕业于麻省理工学院，获得计算机科学与工程学位。他和妻子和孩子一起...
IIS应用程序，用于转换Visual Studio创建的XML文件。 通过搜索指定目录并获取目录中文件的索引来实现。 然后，它使用自定义xsl文件将xml文件转换为人类可读的格式。 文件路径 此应用程序在Home控制器中使用恒定的...