Ajax入门基础01

Ajax入门

• 使用ajax技术，向后台服务器发出异步请求操作，不影响整个页面 的继续操作
• 在js中给服务器发送异步请求

//1.创建异步请求对象var xhr = new XMLHttpRequest();//2.打开异步请求对象，并设置参数var username = document.getElementById("username").value;var url = "checkUsername.do?username=tom";xhr.open("GET",url,true);   //3.绑定处理函数，当请求处理状态改变时，会调用该函数xhr.onreadystatechange = function(){//处于4状态时才可以进行取数据操作,返回状态码为200  if(xhr.readyState == 4&&xhr.status==200){      $("#username_msg").html(xhr.responseText);  }  };//4.发出请求xhr.send(null);

• 创建GET请求

xhr.open(“GET”,url,async);
url为完整地址：”checkUsername.do?username=”+username
async表示是否异步
true:表示发送异步请求（当Ajax对象请求时，用户仍然可以对页面进行其他操作）
false：表示发送同步请求（浏览器锁定页面，用户不能对页面进行其他操作）
- 创建POST请求

xhr.open(“POST”,url,async);
url:checkUsername.do
使用POST请求需要 设置请求的HTTP头信息
- 异步请求不会打断页面操作

//模拟在服务器产生一个异常System.out.println(1/0);//模拟服务器处理事件较长    try {        Thread.sleep(5000);    } catch (InterruptedException e) {        e.printStackTrace();    }