Ajax的三种实现及JSON解析

本文为学习笔记，属新手文章，欢迎指教！！

本文主要是比较三种实现Ajax的方式，为以后的学习开个头。

准备:

1、  prototype.js

2、  jquery1.3.2.min.js

3、  json2.js

 

后台处理程序(Servlet),访问路径servlet/testAjax:

package ajax.servlet;

import java.io.IOException;
import java.io.PrintWriter;

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

/**
 * Ajax例子后台处理程序
 * @author bing
 * @version 2011-07-07
 *
 */
public class TestAjaxServlet extends HttpServlet {
	public void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {

		response.setContentType("text/html;charset=utf-8");
		PrintWriter out = response.getWriter();
		
		String name = request.getParameter("name");
		String age = request.getParameter("age");
		
		System.out.println("{\"name\":\"" + name + "\",\"age\":\"" + age + "\"}");
		out.print("{\"name\":\"" + name + "\",\"age\":" + age + "}");
		
		out.flush();
		out.close();
	}
	public void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {

		doGet(request,response);
	}

}

 

 

TestAjaxServlet接收两个参数：name和age，并返回一个以JSON格式编写的字符串。

 

前台页面参数输入界面:

显示区域

    name:

    age:

 

 

 

一、prototype实现

  

 

在prototype的Ajax实现中，用evalJSON方法将字符串转换成JSON对象。

 

二、jquery实现

 

 

刚接触jQuery,在json的处理上借助了json2.js。还请前辈们指教。。

 

三、XMLHttpRequest实现

  

XMLHttpRequest的实现在json的处理上同样的也借助于json2.js。