ajax get请求

Ajax获取请求的步骤

第一步：创建Ajax的核心对象：XMLHttpRequest对象
new 一个XMLHttpRequest对象
这对象是浏览器内置对象，可以直接使用。
第二步：注册回调函数。
调用onreadystatechange的回调函数
程序执行到这里的时候，后面的回调函数并不会执行，只是将函数注册到XMLHttpRequest对象。
等XMLHttpRequest对象的readySate发生改变的时候，后面的回调函数会执行。
XMLHttpRequest的对象在请求和响应的过程中，该对象的readyState状态从0-4
0：请求未初始化
1：服务器已经建立
2：请求已接受
3：请求处理中
4：请求已经完成
第三步：开启浏览器和服务器之间的通道。
调用open函数。
函数中又三个参数
第一个：请求的方式 POST / GET
第二个：url地址
第三个：ture 代表异步，false 同步
第四步：发送Ajax请求
调用send方法

Ajax的get案列

1.以ajax请求发送用户名，并显示服务端的消息

<script type="text/javascript">
	function checkUsername(username){
		var xhr = new XMLHttpRequest();
		
		xhr.onreadystatechange = function(){
			if(xhr.readyState == 4){
				if(xhr.status == 200){
					var s = xhr.responseText;
					var name=document.getElementById("nameTipMsg");
					name.innerHTML= s;
				}else{
					alert(xhr.status);
				}
			}
		}
		xhr.open("GET","User.do?username="+username,true);
		xhr.send();
	}
</script>
	用户名：<input type="text" name="username" onblur="checkUsername(this.value)"/><span id="nameTipMsg"></span><br>
	密码:<input type="password" name="password"/><br>
</body>

2.配置web.xml(配置访问路径)

<servlet>
	<servlet-name>User</servlet-name>
	<servlet-class>com.ajax.User</servlet-class>
</servlet>

<servlet-mapping>
	<servlet-name>User</servlet-name>
	<url-pattern>/User.do</url-pattern>
</servlet-mapping>

3.验证ajax请求的参数，发出响应给客户端

import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class User extends HttpServlet{
	@Override
	protected void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		response.setContentType("text/html;charset=UTF-8");
		PrintWriter out = response.getWriter();
		String username  =request.getParameter("username");
		if("admin".equals(username)){
			
			out.print("用户名已存在");
		}else{
			out.print("用户名已注册");
		}
	}

}