Ajax

原生的JS实现Ajax方式（仅供了解 查看w3c school离线文档）

---

一、Ajax

异步和同步：
同步：客户端必须等待服务器端的响应。在等待的期间客户端不能做其他操作。
异步：客户端不需要等待服务器端的响应。在服务器处理请求的过程中，客户端可以进行其他的操作。

二、原生JS实现Ajax代码（了解）

代码如下（示例）：

    <script>
        //定义·方法
        function fun() {
            //发送异步请求
            //创建核心对象
            var xmlhttp;
            if (window.XMLHttpRequest)
            {// code for IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp=new XMLHttpRequest();
            }
            else
            {// code for IE6, IE5
                xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
            }
            //建立连接，发送请求
                /*
                    method：请求的类型；GET 或 POST
                    url：文件在服务器上的位置
                    async：true（异步）或 false（同步）
                 */
            xmlhttp.open("GET","ajaxServlet?username=tom",true);
            xmlhttp.send();
            //接受并处理来自服务器的响应结果
            /*
                存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。
                    0: 请求未初始化
                    1: 服务器连接已建立
                    2: 请求已接收
                    3: 请求处理中
                    4: 请求已完成，且响应已就绪
             */
            xmlhttp.onreadystatechange=function()
            {
                if (xmlhttp.readyState==4 && xmlhttp.status==200)
                {
                    var text = xmlhttp.responseText;
                    alert(text);
                }
            }

        }
    </script>

三、$.ajax实现Ajax代码实现

代码如下（示例）：

    <script>
        //定义·方法
        function fun() {
            $.ajax({
                url:"ajaxServlet",//请求路径
                type:"post",//请求方式
                //data:"username=j&age=30"  请求参数
                data:{"username":"jack","age":30},
                success:function (data) {
                    alert(data);
                },//响应成功后的回调函数
            });
        }
    </script>

四、$.get实现Ajax代码实现(post 类似)

代码如下（示例）：

    <script>
        //定义·方法
        function fun() {
            	$.get("ajaxServlet",{"username":"lisi"},function(data){
					alert(data);
				},"text");
            });
        }
    </script>

五、Servlet代码（服务器）

代码如下（示例）：

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

@WebServlet("/ajaxServlet")
public class ajaxServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        //获取请求参数
        String username = request.getParameter("username");
        //模拟处理业务逻辑
        try {
            Thread.sleep(8000);
        } catch (InterruptedException e) {
            e.printStackTrace();
        }
        System.out.println(username);

        response.getWriter().write("hello:"+username);
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        this.doPost(request, response);
    }
}

---