Ajax 异步js和xml的组装 核心：异步刷新技术
概念：全局刷新 在请求转发/重定向技术中，页面跳转的刷新即全局刷新
异步刷新：如果网页中某一个地方需要修改，异步刷新可以使：只刷新需要修改的地方，而页面中其他地方保持不变，例如：百度搜索框、视频点赞
Ajax实现 一共有两种方式：JavaScript和JQuery，但在开发中使用的基本是JQuery
JavaScript实现： 依赖于XMLHttpRequest对象
XMLHttpRequest对象的·方法 1、open(参数1，参数2，true) 与服务端建立链接 第一个参数是方法名（提交方式get/post） 第二个参数是服务器地址 第三个参数如果是true，说明此方法是异步刷新，如果是false，说明是全局刷新，一般情况下都是true 2、send() 如果是get请求：send参数为null即send(null) 如果是post请求：send有参数值为send(参数值) 3、setRequestHeader(header,value) 如果是get请求：不需要设置此方法 如果是post请求：需要设置，还要分两种情况： a、如果请求元素中包含了文件上传：
setRequestHeader("Content-Type","multipart/form-data");b、如果不包含文件上传：
setRequestHeader("Content-Type","application/x-www-form-utlencoded");XMLHttpRequest对象的属性 1、readystate：请求状态 表示XMLHttpRequest对象发送的HTTP请求状态，共有五种状态，如表所示：
状态值简介0表示XMLHttpRequest对象没有初始化1表示XMLHttpRequest对象开始发送请求，已经执行了open()方法并完成了相关资源的准备2表示XMLHttpRequest对象已将请求发送完毕，已经执行了send()方法来发送请求，但还没有收到响应3表示XMLHttpRequest对象开始读取响应信息，已经接受到HTTP响应的头部表示，但是还没有将响应体接收完毕4表示XMLHttpRequest对象将响应信息全部读取完毕只有状态为4代表请求完毕
2、status：响应状态 status表示HTTP响应中的状态码，各状态码的含义入表所示：
状态码含义200服务器正常响应400无法找到请求的资源403没有访问权限404访问的资源不存在500服务器内部错误，很可能使服务器代码有错只有状态码为200代表响应正常
3、onreadystatechange：回调函数
4、responseText 响应格式为String（text）
5、responseXML 响应格式为XML
示例 实例简述：注册一个手机号码，客户端发出一个手机号，服务端判断手机号是否已存在，存在：true，不存在：false
a、客户端index.jsp，负责数据的提供和最终反馈的获取 （含get和post两种请求方式）
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <!-- 鼠标单击事件--> <script type="text/javascript"> function registerGet(){ //get方式请求 var mobile=document.getElementById("mobile").value; //获取mobile值 xmlHttpRequest=new XMLHttpRequest(); //前面不标明属性表示是全局变量 xmlHttpRequest.onreadystatechange=callBack; //注意回调函数不需要加括号 //因为get方式send为空值，所以参数需要用地址栏方式传递 xmlHttpRequest.open("get","MobileServlet?mobile="+mobile,true); xmlHttpRequest.send(null); } function registerPost(){ //post方式请求 var mobile=document.getElementById("mobile").value; //通过ajax异步方式请求服务端 xmlHttpRequest=new XMLHttpRequest(); //设置xmlHttpRequest对象的回调函数 xmlHttpRequest.onreadystatechange=callBack; xmlHttpRequest.open("post","MobileServlet",true); //设置post方式头消息 xmlHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); //通过send传送值 xmlHttpRequest.send("mobile="+mobile); } //定义回调函数（接收服务端返回值） function callBack(){ if(xmlHttpRequest.readyState==4 && xmlHttpRequest.status==200){ //接收服务端返回的数据 var data=xmlHttpRequest.responseText; //服务端返回值为String格式 if(data=="true"){ alert("此号码已存在，请更换！"); }else{ alert("注册成功！"); } } } </script> <title>Insert title here</title> </head> <body> 手机：<input id="mobile"><br/> <input type="button" value="注册" onclick="registerGet()"/> </body> </html>b、服务端MobileServlet，负责数据的处理和处理结果的反馈
package my.mobile.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; public class MobileServlet extends HttpServlet { protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { request.setCharacterEncoding("UTF-8"); response.setCharacterEncoding("UTF-8"); response.setContentType("text/html; charset=UTF-8"); PrintWriter out=response.getWriter(); String mobile=request.getParameter("mobile"); //假设此时数据库中只有一个号码：12345678910 if(("12345678910").equals(mobile)) { //常量字符串写在前，防止返回空指针 //return true; //通过输出流进行信息返回 out.write("true"); } else { //return false; out.write("false"); } out.close(); } protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { doGet(request, response); } }