ajax的核心技术应用--javascript 解析xml文档,提取xml文档中的数据

客户端:

<%@ page language="java" contentType="text/html; charset=GB18030"
    pageEncoding="GB18030"%>
   
<center>
        <input type="button" value="Ajax invoke" onClick="ajaxRead();">
        <div id="xmldata">
        </div>
</center>

<script language="Javascript">
   
    var xmlhttp=null;
   
    /**
    * ajax向服务器发送请求
    * 2006-6-23  Jarry @shenzhen
    **/
    function xmlHttpRequest()
    {
        try{
       
            xmlhttp = new XMLHttpRequest();
           
        }catch(e){
       
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
       
        //var url = "http://localhost:8088/insure/ajaxServlet.do?hello=hello Jarry"
        var url = "./ajaxProcess.do?hello=hello Jarry"
       
        xmlhttp.onreadystatechange = callback;
       
        xmlhttp.open("Get",url,true);
       
        //xmlhttp.send();//xmlhttp.send()方法发送的数据为空时，在server端Servlet会以doGet()方法来处理
       
        xmlhttp.send("send data");//xmlhttp.send(data)方法发送的data数据非空时，在server端Servlet会以doPost()方法来处理
       
    }
   
    /**
    * ajax客户端调用的函数
    * 2006-6-23  Jarry @shenzhen
    **/
    function callback(){
       
       
        if(xmlhttp.readyState == 4)//返回XMLHttp请求的当前状态:4 (完成) ;数据接收完毕,此时可以通过通过responseBody和responseText获取完整的回应数据
        {
            var returnContent = xmlhttp.responseText;
           
            if(xmlhttp.status == 200)//返回当前请求的http状态码:200 OK
            {
               
                alert("returnContent="+returnContent);
               
                alert('success!');
            }else{
           
                alert("returnContent="+returnContent);
               
                alert('something wrong!/nxmlhttp.status='+xmlhttp.status);
            }
       
        }
       
    }
    ///
    /**
    * 2007-01-22 Jarry @ beijing
    *
    */
    function ajaxRead(){
      var xmlObj = null;
      if(window.XMLHttpRequest){
          xmlObj = new XMLHttpRequest();
      } else if(window.ActiveXObject){
          xmlObj = new ActiveXObject("Microsoft.XMLHTTP");
      } else {
          return;
      }
      xmlObj.onreadystatechange = function(){
        if(xmlObj.readyState == 4){
          var xml = xmlObj.responseText;
          processXML(xml);
        }
      }
      var url = "./ajaxProcess.do?hello=hello Jarry";
      xmlObj.open ('GET', url, true);
      xmlObj.send ('you can send a mount of data! ');
    }
   
    /**
    * 2007-01-22 beijing
    * jarry
    */
    function processXML(xml){
        //var xml="<?xml version='1.0' encoding='utf-8'?><p><id>hello</id><name first='yes'>linda</name></p>";
          alert(xml);
          var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
        xmlDoc.async = false;
        xmlDoc.loadXML(xml);
          var node = xmlDoc.documentElement;
          for(var i=0;i<node.childNodes.length;i++){
             
              if(node.childNodes[i].nodeName=="policyId"){
                 
                  var policyId = node.childNodes[i].text;
                  //alert("policyId="+policyId);
              }
              if(node.childNodes[i].nodeName=="policyHoder"){//16
                  var name = node.childNodes[i].getAttribute('name');
                  //alert(name);
              }
              if(node.childNodes[i].nodeName=="insuredList"){
                  var insuredList = node.childNodes[i];
                  var insured = insuredList.childNodes;
                  for(var index=0;index<insured.length;index++){
                      var name       = insured[index].getAttribute('name');
                      var certiType = insured[index].getAttribute('certiType');
                      var certiName = insured[index].getAttribute('certiName');
                      var certiCode = insured[index].getAttribute('certiCode');
                      var telephone = insured[index].getAttribute('telephone');
                      var s = "name="+name + " certiType="+certiType + " certiName="+certiName + " certiCode="+certiCode +" telephone="+ telephone;
                      //alert(s);
                  }
                 
              }
              if(node.childNodes[i].nodeName=="persuadeContent"){
                 
                  var persuadeContent = node.childNodes[i].text;
                  alert(persuadeContent);
                  document.getElementById("xmldata").innerHTML=persuadeContent;
              }
          }   
    }
   
   
</script>



服务器端:

/**
 * 接受XMLHttpRequest对象的请求，处理数据完成后
 * 返回给客户端
 */
package com.kevin.samples.controller;

import java.io.BufferedInputStream;
import java.io.BufferedReader;
import java.io.InputStreamReader;
import java.io.PrintWriter;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.springframework.web.servlet.ModelAndView;
import org.springframework.web.servlet.mvc.AbstractController;

import com.kevin.samples.util.Debug;

/**
 * @author Jarry
 * @date   2006-6-23
 * @time   10:13:20
 */
public class AjaxController extends AbstractController {
   
    private String successView;
   
    /* (non-Javadoc)
     * @see org.springframework.web.servlet.mvc.AbstractController#handleRequestInternal(javax.servlet.http.HttpServletRequest, javax.servlet.http.HttpServletResponse)
     */
    protected ModelAndView handleRequestInternal(HttpServletRequest request,
            HttpServletResponse response) throws Exception {
        // TODO Auto-generated method stub
       
        /**
         *       request.getParameter的意义：
         * 接受XMLHttpRequest对象的open("Get",url,true)方法
         * 中url的queryString中的参数，queryString大小受限。
         */
        String hello = request.getParameter("hello");
        Debug.log(this.getClass(), hello);
       
        /**
         *    下面的操作数据流代码的意义：
         * 来接受XMLHttpRequest对象的send(data)方法
         * 中发送到server端的data数据，这个data不受
         * 数据量大小的限制
         */
        BufferedInputStream bis = new BufferedInputStream(request.getInputStream());
        InputStreamReader insr = new InputStreamReader(bis);
        BufferedReader br = new BufferedReader(insr);
        StringBuffer buffer = new StringBuffer();
        String line = br.readLine();
        while(line != null){
           
            buffer.append(line);
            line = br.readLine();
        }
        String acceptData = buffer.toString();
       
        Debug.log(this.getClass(),"acceptData="+acceptData);
       
        /**
         * 设置发送到客户端的文本字符类型
         */
        response.setContentType("text/html; charset=GB2312");
       
       
        /**
         * 向client端发送处理后的数据
         * XMLHttpRequest对象的responseText、
         * responseXML、responseBody属性接受这些数据
         */
        PrintWriter out = response.getWriter();
        //out.println(hello);
        //out.write("您好，这些数据都是来自Server端！");
        String s = this.constructXml();
        Debug.log(this.getClass(),"s="+s);
       
        out.write(s);
        out.close();
       
        /**
         * 禁止缓存
         *
         * */
        response.setHeader("Cache-Control","no-store");
        response.setHeader("Pragrma","no-cache");
        response.setDateHeader("Expires",0);
       
        this.setSuccessView("AjaxView");
       
        return null;//new ModelAndView(this.getSuccessView());
   
    }

   
    public String getSuccessView() {
        return successView;
    }

    public void setSuccessView(String successView) {
        this.successView = successView;
    }
   
    /**
     * 构建一个保单policy的xml文档
     * @author Jarry
     * @date 2007-01-22 beijing
     * @return
     */
    public String constructXml(){
        StringBuffer buffer = new StringBuffer();
        buffer.append("<?xml version='1.0' encoding='UTF-8'?>");
        buffer.append("<policy>");
        buffer.append("<policyId>12345678</policyId>");
        buffer.append("<policyStatus>有效</policyStatus>");
        buffer.append("<productID>00012351205</productID>");
        buffer.append("<productName>福寿双全</productName>");
        buffer.append("<premium>2356.4</premium>");
        buffer.append("<insureAmount>10000</insureAmount>");
        buffer.append("<cashValue>1466.4</cashValue>");
        buffer.append("<holdDate>2005.10.02</holdDate>");
        buffer.append("<validateDate>2005.10.05</validateDate>");
        buffer.append("<acceptDate>2005.10.06</acceptDate>");
        buffer.append("<chargeTimes>3</chargeTimes>");
        buffer.append("<organId>123214</organId>");
        buffer.append("<organName>北京分公司</organName>");
        buffer.append("<reissueTimes>2</reissueTimes>");
        buffer.append("<arrearage>1000</arrearage>");
        buffer.append("<singlePolicy >yes</singlePolicy>");
        buffer.append("<policyHoder name='张三' certiType='1' certiName='身份证' certiCode='010215513591231' telephone='86410856'></policyHoder>");
        buffer.append("<insuredList>");
        buffer.append("<insured name='李四' certiType='1' certiName='身份证' certiCode='010215513591231' telephone='86410856'></insured>");
        buffer.append("<insured name='李二' certiType='1' certiName='身份证' certiCode='010215513591231' telephone='86410856'></insured>");
        buffer.append("</insuredList>");
        buffer.append("<service name='王五' serviceId='1236885' certiType='1' certiName='身份证' certiCode='010215513591231' serviceStutas='在职' telephone='86410856' department='北京分公司'></service>");
        buffer.append("<persuadeTimes>1</persuadeTimes>");
        buffer.append("<persuadeContent><![CDATA[劝阻的内容<table border=1 cellspacing=/"1/" cellpadding=/"4/" bordercolorlight=/"#ccccff/"><tr><td>hello,& world！</td><td>你好！</td></tr></table>]]></persuadeContent>");
        buffer.append("</policy>");
        return buffer.toString();
    }
}