`

使用XMLHttpRequest处理server端返回的xml

阅读更多

这个例子是《Ajax基础教程》上的例子,写在这里是为了督促自己要加快学习Ajax的进度。

 

parseXML.html

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
		<title>Parse xml response</title>
		
		<script type="text/javascript">
			var xmlHttp;
			var requestType = "";
			
			function createXMLHttpRequest(){
				if(window.ActivXObject){
					xmlHttp = new ActivXObject("Microsoft.XMLHTTP");
				}else if(window.XMLHttpRequest){
					xmlHttp = new XMLHttpRequest();
				}
			}
			
			function startRequest(requestedList){
				requestType = requestedList;
				createXMLHttpRequest();
				xmlHttp.onreadystatechange = handleStateChange;
				xmlHttp.open("GET","parseXML.xml",true);
				xmlHttp.send(null);
			}
			
			function handleStateChange(){
				
				if(xmlHttp.readyState == 4){
					if(xmlHttp.status == 200){
						
						if(requestType == "north"){
							listNorthStates();
						}else if(requestType == "all"){
							listAllStates();
						}
					}
				}
			}
			
			function listNorthStates(){
				var xmlDoc = xmlHttp.responseXML;
				var northNode = xmlDoc.getElementsByTagName("north")[0];
				
				var out = "Northern States";
				var northStates = northNode.getElementsByTagName("state");
				
				outputList("Northern States",northStates);
			}
			
			function listAllStates(){
				var xmlDoc = xmlHttp.responseXML;
				var allStates = xmlDoc.getElementsByTagName("state");
				
				outputList("All States",allStates);
			}
			
			function outputList(title,states){
				var out = title;
				var currentState = null;
				
				for(var i = 0; i < states.length; i++){
					currentState = states[i];
					out = out + "\n- " + currentState.childNodes[0].nodeValue;
				}
				
				alert(out);
			}
		
		</script>
		
	</head>
	<body>
		<form action="#">
			<input type="button" value="View All Listed States" onclick="startRequest('all')"/>
			<br/><br/>
			<input type="button" value="View All Listed Northern States" onclick="startRequest('north')"/>
		</form>
		
	</body>
</html>

 

 

parseXML.xml

<?xml version="1.0" encoding="utf-8"?>

<states>
	<north>
        <state>Minnesota</state>
        <state>Iowa</state>
        <state>North Dakota</state>
    </north>
    <south>
        <state>Texas</state>
        <state>Oklahoma</state>
        <state>Louisiana</state>
    </south>
    <east>
        <state>New York</state>
        <state>North Carolina</state>
        <state>Massachusetts</state>
    </east>
    <west>
        <state>California</state>
        <state>Oregon</state>
        <state>Nevada</state>
    </west>
</states>

 

 

分享到:
评论

相关推荐

    利用AJAX修改服务器端XML并在客户端访问XML

    6. **返回XML数据到客户端** 服务器端完成修改后,可以将XML数据作为字符串返回给客户端。在JavaScript中,我们可以获取到这个返回的XML字符串,然后使用`DOMParser`解析成DOM对象,以便在客户端访问: ```...

    ajax使用XMLHttpRequest实现简单的信息验证

    在Web开发中,Ajax(Asynchronous JavaScript and XML)是一种创建动态网页的技术,允许在不刷新整个页面的情况下与服务器交换数据并更新部分网页内容。这里我们关注的是如何使用XMLHttpRequest对象来实现一个简单的...

    asp发送接收xml.rar

    ASP在这种场景下,可能作为服务器端接口,接收来自手机客户端(如Java小程序、WAP浏览器等)的XML数据,处理业务逻辑后返回结果。 6. **错误处理和调试**:在处理XML数据时,需要考虑可能出现的错误,如XML格式不...

    基于xml的Ajax

    6. **接收响应**:当服务器完成处理并返回响应时,XMLHttpRequest对象的`onreadystatechange`事件被触发。我们通过检查`readyState`属性和`status`属性来确认响应是否已成功接收。 7. **解析XML**:使用JavaScript...

    Ajax简单实例 XMLHttpRequest

    Ajax,即Asynchronous JavaScript and XML...学习Ajax,首先要掌握创建XMLHttpRequest对象、设置请求、发送请求以及处理响应的基本步骤。通过不断实践和深入学习,你将能够熟练地利用Ajax构建高效、动态的Web应用程序。

    ajax处理服务器返回的三种数据类型方法

    如果服务器返回XML数据,需要解析这个XML文档以提取所需信息。XML是一种结构化数据,类似于HTML,但通常用于存储和传输数据,而不是显示内容。在JavaScript中,可以使用`DOMParser`或者`ActiveXObject`(对于旧版IE...

    Asp+Js读取远程xml文件

    压缩包内的`readXML.asp`可能是一个Asp页面,用于接收JavaScript的请求并返回XML数据,或者处理CORS相关的设置。而`live.htm`可能是包含JavaScript代码的HTML页面,它负责发起对`readXML.asp`的请求并解析返回的XML...

    ajax+php--接收处理xml和text格式数据

    在Web开发中,AJAX(Asynchronous JavaScript ...总结,这个例子展示了如何使用AJAX与PHP结合,实现客户端发送XML或Text数据,服务器端接收并处理,然后再返回响应数据的过程。这为创建实时、高效的Web应用提供了基础。

    xml 中连接数据库的方法

    - 客户端发送XMLHttpRequest请求,服务器处理请求并返回XML数据。 5. **XML Data Binding** - 工具如JAXB(Java Architecture for XML Binding)可以将XML数据映射到Java对象,反之亦然。 - 先将数据库中的记录...

    Java实现XML导入不同数据库,从数据库导出数据到XML

    服务器端,通常使用Servlet或者Spring MVC等框架来接收和处理请求,完成数据库操作,并将结果返回。返回的数据可以是XML格式,前端再将其解析并更新页面。 总的来说,Java结合JDOM和Ajax技术,可以实现高效、灵活的...

    window.XMLHttpRequest详解(AJAX工作原理)2

    ### window.XMLHttpRequest详解(AJAX工作原理) #### 一、简介 `window.XMLHttpRequest` 是一个内置对象,用于在浏览器端发起异步 HTTP ...掌握 `XMLHttpRequest` 的使用对于前端开发者来说是非常重要的技能之一。

    asp+xmlhttp+javascript+xml

    【标题】"asp+xmlhttp+javascript+xml" 涉及的核心技术是AJAX(异步JavaScript和...客户端JavaScript通过XMLHTTP对象发起请求,服务端ASP处理请求并返回XML数据,整个过程无缝衔接,提升了网页应用的性能和用户体验。

    把数据读到xml文件

    通过JavaScript的XMLHttpRequest对象,可以发送AJAX请求,服务器端处理后返回XML数据,前端再解析这些数据并更新DOM。例如: ```javascript var xhr = new XMLHttpRequest(); xhr.open("GET", "server.aspx", true);...

    php的httpxml很简单就会明白

    尽管XMLHttpRequest本身是由客户端(浏览器)发起的,但PHP作为服务器端脚本语言,可以处理这些由XMLHttpRequest发送的HTTP请求,并返回所需的数据。具体来说,当客户端通过XMLHttpRequest向服务器发送一个请求时,...

    ASP实例开发源码—Asp+Ajax+XML简单房产程序 v1.0(适合学习ajax+xml).zip

    在本实例中,开发者可以研究如何使用JavaScript和XMLHttpRequest对象实现AJAX通信,以及如何处理返回的XML数据。 XML(eXtensible Markup Language)是一种标记语言,用于存储和传输结构化数据。在本房产程序中,...

    ajax发送xml请求小示例

    2. **解析XML响应**:当服务器返回XML数据时,我们可以使用DOM方法来解析和操作数据。 ```javascript var responseXML = xhr.responseXML; var rootElement = responseXML.documentElement; var childNodes = root...

    Effective.XML.50.Specific.Ways.To.Improve.Your.XML

    理解XMLHttpRequest对象以及如何处理返回的XML数据。 6. **ASP.NET中的XML**:在ASP.NET框架下,XML集成得非常好,可以用于配置文件、数据绑定以及与Web服务的交互。了解System.Xml命名空间中的类和方法。 7. **C#...

    jquery ajax学习笔记2 使用XMLHttpRequest对象的responseXML

    在本节的学习笔记中,主要介绍了如何使用XMLHttpRequest对象的responseXML属性来接收XML数据,并将其作为DOM对象来处理。这个过程涉及到前端JavaScript代码的编写以及后端servlet的配置。 首先,文档提到了对ajax...

Global site tag (gtag.js) - Google Analytics