Ajax -- 接受 XML 响应格式的数据

来源:互联网 发布:域名未授权怎么办 编辑:程序博客网 时间:2024/05/29 07:37
<body>     <center>           <button id="btn05">接受【XML】格式的响应数据</button><br/>     <br/><br/>     <form action="AjaxRequestServlet" method="post">           <input type="text" name="username" /><input type="submit" value="submit" />     </form>     </center></body>
<%@ page language="java" contentType="text/html; charset=UTF-8"    pageEncoding="UTF-8"%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Insert title here</title><style type="text/css">button {width: 200px;}</style><script type="text/javascript">     function getRequest(){           //创建XMLHttpRequest 对象           var xmlHttpRequest = null;           try{//试用与主流浏览器                xmlHttpRequest = new XMLHttpRequest();           }catch(e){//适用于IE5、IE6                try{                     xmlHttpRequest = new ActiveXObejct("Microsoft.XMLHTTP");                }catch(e){                     alert("your browser not support Ajax!");                }           }           return xmlHttpRequest;     };     var request = getRequest();     //页面加载完成后加载     window.onload = function(){           document.getElementById("btn05").onclick = function(){                request.open("POST", "AjaxResponseXML", true, "admin", "admin");                request.send();                //1. 通过 onreadystatechange 事件监听 readystate 属性值的变化                //2. 在 readystate 属性等于 4 时, 并且 status 属性等于 200 时, 接受响应数据                request.onreadystatechange = function(){                     if(request.readyState == 4 && request.status == 200){                          //<user><userName>Tom<userName/><user/>                           //使用responseXml 属性接受 XML 格式的数据                           var result = request.responseXML;                           //alert(result);                          alert(result.getElementsByTagName("userName")[0].firstChild.nodeValue);                     }                };           };     };</script></head>

这里写图片描述

package com.atguigu.ajax.servlet;import java.io.IOException;import java.io.PrintWriter;import javax.servlet.ServletException;import javax.servlet.annotation.WebServlet;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;@WebServlet("/AjaxResponseXML")public class AjaxResponseXML extends HttpServlet {    private static final long serialVersionUID = 1L;    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {        //准备XML 数据, 作为响应返回给浏览器        String xmlStr = "<user><userName>Tom</userName></user>";        //告诉浏览器, 服务器端返回的是 XML 格式的数据        response.setContentType("text/xml;charset=utf-8");        PrintWriter out = response.getWriter();        out.write(xmlStr);    }}