当前位置:Gxlcms > JavaScript > 分享ajax三种实现方法

分享ajax三种实现方法

时间:2021-07-01 10:21:17 帮助过:32人阅读

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

准备:

1、 prototype.js
2、 jquery1.3.2.min.js
3、 json2.js

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

Java代码

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格式编写的字符串。

前台页面参数输入界面:

Html代码

显示区域
name:
age:

一、prototype实现

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

二、jquery实现

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

三、XMLHttpRequest实现

人气教程排行