平时经常看到当我们在百度的时候，输入一些搜索信息，搜索栏下面就会出现一些与搜索有关的提示信息，这就是很典型的ajax异步交互，我们不用把搜索信息全写完成，然后点击百度一下，当我们输入搜索信息的时候页面就与服务器之间进行了数据的通信，在不刷新页面的情况下出现我们想要的信息，其中的原理便是页面与服务器之间通过ajax进行通信。
通常我们用ajax都是通过jQuery中的$.ajax(){
type:"post/get",
url:"请求资源的url",
async:"是否异步通信",---默认不写情况下为true
data:"发送的数据",
dataType:"服务器返回的数据格式"，----一般为json
success:function(){
成功之后的回调函数
},
error:function(jqXHR){
失败之后的操作
}
}
这种形式完成页面与服务器之间的异步交互。
ajax异步交互的一个重要对象是XHLHttpRequest,简称XHR，这个名字可以在谷歌浏览器下的开发者模式中Network中看到
XHR最早是微软在IE中加入的，未经过jQuery封装的ajax，底层实现原理如下。
1.当我们需要与服务器进行异步交互时，新建XHR对象
现在一般的方式是if（window.XHLHttpRequest){
XMLHttpRequest xhr = new XMLHttpRequest();
}
不过为了严谨，在IE早期的时候并不是用的XMLHttpRequest对象，而是Active Object对象，可以通过以下方式获得
if(window.ActiveObject){
XMLHttpRequest xhr = new ActiveObject("Microsoft.XMLHTTP");
}
2.新建为XHR对象之后，调用XHR的open()方法就可以准备与服务器进行交互了
xhr.open(url,method,async);
open()方法包含三个参数，url是请求的服务器url，method为get，post，delete等，async是一个布尔值，为true时则表示允许ajax与服务器异步交互，为假时则不允许。
3.发送数据
xhr.send();
4.监控xhr对象的状态，通过检测xhr对象的状态来进行调用回调函数
xhr.onreadystatechange = callBack();
xhr对象状态有5种
0---xhr未初始化
1---xhr已经初始化，可以进行发送
2---xhr的数据已发送过去
3---正在接受服务器响应
4---接收响应完成
所以当xhr对象的状态为4时，则代表前台页面与服务器进行交互完成
function callBack(){
if(xhr.readyState == 4){
if(xhr.status ==200){
这里进行接收服务器响应的操作
}
}
到此为止，ajax最原始的做法基本完成，不过现在大家都用jQuery封装好的了，如文章开头出所示。