您的位置:首页 > Web前端 > JavaScript

JavaScript学习(三)——利用javascript访问XML文件

2016-03-13 18:13 549 查看

利用javascript访问XML文件

今天在学习JavaScript的时候,发现可以读取XML文件,下面是读取XML文件的一个例子程序。

datetest.js

function testxml() {
alert('测试XML');
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
} else {
xmlhttp = new ActiveXobject("Microsoft.XMLHTTP");
}

xmlhttp.open("GET", "./xml/first.xml", false);
xmlhttp.send();
xmlDoc = xmlhttp.responseXML;

alert("学生的个数:" + xmlDoc.getElementsByTagName("student").length);
alert("第一个学生的属性个数:" + xmlDoc.getElementsByTagName("student")[0].childNodes.length);

var student2 = xmlDoc.getElementsByTagName("student")[0].childNodes[0].childNodes[0].nodeValue;
student2 = student2 + "  "+ xmlDoc.getElementsByTagName("student")[0].childNodes[1].childNodes[0].nodeValue;
student2 = student2 + "  "+ xmlDoc.getElementsByTagName("student")[0].childNodes[2].childNodes[0].nodeValue;
alert("访问第一个学生的数据:" + student2);

for(var i = 0 ; i < xmlDoc.getElementsByTagName("student").length;i++){
var student3 = "";
for(var j = 0; j < xmlDoc.getElementsByTagName("student")[i].childNodes.length;j++){
student3 =student3 + xmlDoc.getElementsByTagName("student")[i].childNodes[j].childNodes[0].nodeValue + "  ";
}
alert("第" + (i+1) + "个学生的信息:" + student3);
}
}


这是对应的index.jsp

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">

<title>My JSP 'index.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<script type="text/javascript" src="<%=basePath%>js/datetest.js"></script>
</head>

<body>
<br />
<p>
测试读取xml:<input type="button" id="button2" value="测试XML" onclick="testxml()" />
</p>
</body>
</html>
下面是XML文件

<?xml version="1.0" encoding="UTF-8"?>
<xml-body>
<student>
<name>小明</name>
<age>12</age>
<birth>1998年1月7日</birth>
</student>
<student>
<name>小红</name>
<age>13</age>
<birth>1996年1月8日</birth>
</student>
<student>
<name>小李</name>
<age>15</age>
<birth>1990年1月13日</birth>
</student>
<student>
<name>小黑</name>
<age>1</age>
<birth>1996年1月8日</birth>
</student>
</xml-body>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: