Ajax + Json

一、Ajax
AJAX指异步的JavaScript及XML（Asynchronous JavaScript And XML）,AJAX 不是编程语言，而是创建更好更快以及交互性更强的 Web 应用程序的技术。通俗的讲叫异步调用，局部刷新。

计算机中的异步与我们生活的同步是一样的，计算机中的异步表示另一个线程同时执行相关操作。

Ajax 所涉及到的技术是，JavaScript，CSS，html,XML，把这几门技术溶合到一起，实现页面的一些特效。

应用Ajax技术。重要对象是XMLHttpRequest，这个对象负责异步向服务端发送，并接收服务端返回的结果。

Ajax操作步骤：
1.创建XMLHttpRequest对象
2.设置回调函数：回调函数是当服务器正确结果后所执行的函数，在里面对返回结果进行处理。什么时候返回结果，函数什么时候执行。
3.初始化XMLHttpRequest对象（请求的URL,请求的所需的数据，请求的类型（get,post））
4.发送请求。

XMLHttpRequest属性

XMLHttpRequest方法

实现原生的Ajax比较麻烦，代码量大，还容易出错。目前，大家都在用Jquery这个框架来实现Ajax效果，因为Jquery框架已经封装好了Ajax函数，直接使用，只需要在回调函数处理结果就行。

使用Jquery框架来实现Ajax特效，必须在页面上导入Jquery的JS文件。尽量把这个文件放在最前面。

Jquery框架常用的函数有：$.ajax(); $.post(); $.get();$.getJSON();

二、Json
JSON 语法是 JavaScript 对象表示法语法的子集。
数据在名称/值对中
数据由逗号分隔
花括号保存对象
方括号保存数组

var v1={"phone":"13245607986"};
alert(v1.phone);
<script type="text/javascript">
var v = [
         {"name":"张三","age":"20"} ,
         {"name":"李四","age":"21"},
         {"name":"周成","age":"26"}
        ];
alert(v[1].name);
</script>

JSON：JavaScript 对象表示法（JavaScript Object Notation）。
JSON 是存储和交换文本信息的语法。类似 XML。
优点： JSON 比 XML 更小、更快，更易解析。

案例：

<script type="text/javascript">
      var v = [{"name":"张明","age":"22"},{"name":"王明","age":"20"}];
      alert(v[0].age);  //取数组中第一个对象的age属性值 ： 22
      alert(v[1].name); //取数组中第二个对象的name属性值 ：王明
   </script>

三、Ajax+Json实现无刷新分页
如何把服务端的对象转换成JSON格式的字符串，可以手动转换，常用第三方提供的转换工具来转换：
commons-beanutils-1.8.0.jar
commons-collections-3.1.jar
commons-lang-2.5.jar
commons-logging-1.1.3.jar
ezmorph-1.0.6.jar
json-lib-2.3-jdk15.jar

在后台代码中就可以实现转换功能：

int did = Integer.parseInt(request.getParameter("gid"));
..... //取数据list
response.setContentType("text/html;charset=utf-8");
try {
    JSONArray json = JSONArray.fromObject(list);
    JSONObject jb = new JSONObject();
    jb.put("city", json);
    response.getWriter().write(jb.toString());  //向客户端写出JSON格式的数据
} catch (Exception e) {
    System.out.println(e.getMessage());
}

分页功能实现：
1.服务端根据查询的页码返回当前分页所需要的数据（页码，页大小，总页数，总记录数，当前页数据）封装在一个分页工具类对象中。
2.把分页工具类对象转换成JSON格式的字符串，返回给前端页面
3.前端页面是Ajax请求，在回调函数中来处理返回的JSON数据。
4.呈现数据在页面上。
注意，JSON格式化对象，对象中的属性如果是Date类型，会报错，所以把Date类型要改成String类型。