以下参考部分菜鸟驿站以及W3school
Ajax是一种让网页的响应更快的技术，因为它允许异步地向服务器发送请求，而不需要重新载入页面，使用Ajax来提升用户体验。
Ajax=Asynchronous JavaScript and XML （异步JavaScript和XML）
Ajax不是新的编程语言，而是一种使用了现有标准的新方法。它最大的优点在于不重新加载整个页面的情况下，可以与服务器交换数据并更新部分网页内容。Ajax是不需要任何浏览器插件，但是需要用户允许JavaScript在浏览器上执行。
1.Ajax工作原理
在浏览器中，有一个事件发生了，然后会产生一个XMLHttpRequest 对象，然后发送HttpRequest到服务器，处理HTTPRequest请求，创建一个响应然后把数据传送到浏览器中，浏览器中用JavaScript处理从服务器中返回来的数据，之后就更新部分数据。
XMLHttpRequest对象（异步的与服务器交换数据），JavaScript/DOM(信息显示/交互)，CSS（给数据定义样式），XML（作为转换数据的格式），Ajax应用程序与浏览器和平台无关的。
所有的现代浏览器都是支持XMLHttpRequest对象的（IE5 IE6）使用的是ActiveXObject.
XMLHttpRequest是用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。
2.创建XMLHttpRequest对象，所有的现代浏览器(IE7+,Firefox,Chrome,Safari以及Opera)内均建XMLRequest对象。
那创建的语法是var=new XMLHttpRequest();
而IE 5 IE6就要这样子创建： var=new ActiveXObject("Microsoft.XMLHTTP");
为了保证可以在所有的浏览器中运行，我们一般都要对他们进行创建，如果不支持的话，那么我们就创建ActiveXObject;
有关的代码是：
var xmlhttp; if(window.XMLHttpRequest){ xmlhttp=new XMLHttpRequest(); } else{ xmlhttp=new ActiveXObject('Microsoft.XMLHTTP'); }
3.向服务器中发送请求
之前提过，XMLHttpRequest对象是用于和服务器交换数据的，如果我们想要将请求发送到服务器，那么我们就可以使用XMLHttpRequest对象的open()和send()方法：
xmlhttp.open("GET","ajax_info.txt",true);
xmlhttp.send();
首先我们来介绍一下open()这个方法，从上面可以看到open()中有三个参数的，分别是method,url,asyc，他们分别规定了请求的类型，URL以及是否异步处理请求。一般来说，请求的类型分为GET或者是POST.URL是指文件中服务器上的位置，async是表示是异步还是同步，如果是异步我们就设置为true,如果是同步的话，就设置为false。这里设置为true就是代表我们通过Ajax就可以在等待服务器响应的时候执行其他的脚本，当响应就绪后对响应进行处理，大大利用了资源，提高了网站的性能。
send(string)的方法，send()中其实有一个参数的，但是只用于post请求，但是这里是GET请求，所以没有使用这个参数.
**那我们什么时候用GET，什么时候使用POST呢？
GET其实会更加地简单，并且在大部分情况下我们都可以使用。然而在以下的情况下，我们使用的是POST请求。
1）无法使用缓存文件（更新服务器上的文件或者数据库）
2）向服务器发送大量的数据（POST没有数量上的限制）
3）发送包含未知的字符的用户输入时，POST更加可靠而且也稳定。而get可以直接在url后面添加要传输的数据。而post是则怎样传送数据的呢？
就要使用setRequestHeader()来添加HTTP头，然后在刚刚说过的send()方法中添加string.例如：
xmlhttp.open("POST",url,true);
xmlhttp.setRequestHeader("Content-type"."application/x-www-form-urlencoded");
xmlhttp.send("frame=Henry&lname=Ford");
关于这个url，是指服务器上文件的地址。该文件可以是任何类型的文件，比如是.txt,和.xml，或者服务器脚本文件，比如.asp和.php。
4.服务器响应
如果我们需要获得来自服务器的响应的话，就使用XMLHttpRequest对象的responseText（这个是获得字符串形式的响应数据，如果我们服务器的响应不是来自于XML的话，我们就应该使用这个属性）或者是responseXML（这个是获得XML形式的响应数据）属性。
document.getElememtById("myDiv").innerHTML=xmlhttp.responseText;
如果我们使用的是responseXML是需要作为XML对象进行解析的。
xmlDoc=xmlhttp.responseXML;
txt="";x=xmlDoc.getElementsByTagName("ARTIST");
for(i=0;i<x.length;i++){
txt=txt + x[i].childNodes[0].nodeValue + "<br>";
}document.getElementById("myDiv").innerHTML=txt;
5.onreadystatechange事件
当请求被发送到服务器时，我们需要执行一些基于响应的任务。每当readyState改变时，就会触发onreadystatechange事件。readyState属性存有XMLHttpRequest的状态信息。
下面是XMLHttpRequest对象的三个重要的属性：
属性 描述
onreadystatechange 存储函数（或函数名）。每当readyState属性改变的时候，就会调用该函数。
readtState 存有XMLHttpRequest的状态。从0到4发生变化。
0：请求未初始化。
1：服务器连接已经建立
2：请求已经接收
3：请求处理中
4：请求已经完成，且响应已就绪。
status 200:"OK"
404:未找到该页面
在onreadystatechange事件中，我们规定当服务器响应已做好被处理的准备时所执行的任务。
当readyState等于4且状态为200时，表示响应已经就绪：
xmlhttp.onreadystatechange=function(){
if(xmlhttp.readyState==4&&xmlhttp.status==200){
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
##onreadystatechange事件被触发5次（0-4），对应着readyState的变化。
使用回调函数
回调函数是一种以参数形式传递给另一个函数的函数。如果你的网站中存在多个AJAX任务的话，你应该为创建XMLHttpRequest对象编写一个标准的函数，并为每个AJAX任务调用该函数。该函数调用应该包含URL以及发生onreadystatechange事件执行时的任务（每次调用可能不尽相同）
function myFunction(){
loadXMLDoc(URL,function(){ //加载XML文档中的代码可以存储在一个函数中
if(xmlhttp.readyState==4&&xmlhttp.status==200){
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
});
}
