1、HTML页面通过ajax发送http请求(图片是随便找的，需要放自己的前端代码自己)

        2，通过ajax发送请求（先图之后是代码）

 

window.onload(function requestData(){
        $.ajax({
            url: "要访问的地址",
            type: "post",
            dataType: "json",
            success: function(data){
                /*这个方法里是ajax发送请求成功之后执行的代码*/
                showData(data);//我们仅做数据展示
            },
            error: function(msg){
                alert("ajax连接异常："+msg);
            }
        });
    });

  3，后台的数据 （先图之后是代码）

 

@RequestMapping(value="/queryAllStudent")
    public void query(HttpServletResponse resp) {
        try {
            /*list集合中存放的是好多student对象*/
            List<Student> students = userService.getAllStudentInfo();
            /*将list集合装换成json对象*/
            JSONArray data = JSONArray.fromObject(students);
            //接下来发送数据
            /*设置编码，防止出现乱码问题*/
            resp.setCharacterEncoding("utf-8");
            /*得到输出流*/
            PrintWriter respWritter = resp.getWriter();
            /*将JSON格式的对象toString()后发送*/
            respWritter.append(data.toString());
        } catch (Exception e) {
            e.printStackTrace();
        }
    } 

public class student {
    private int id;//id
    private String name;//姓名
    private String password;//密码

    //省略get set方法。。。
}

4，前台展示数据（表格形式）

 1 //展示数据
 2 function showData(data) {
 3         var str = "";//定义用于拼接的字符串
 4         for (var i = 0; i < data.length; i++) {
 5             //拼接表格的行和列
 6             str = "<tr><td>" + data[i].name + "</td><td>" + data[i].password + "</td></tr>";
 7             //追加到table中
 8             $("#tab").append(str);         }
10     }

此处最重要（完整的解释了数据的流程）