ajax是什么呢？说白了就是一个请求，一个读取服务器资源以及提交资源到服务器的中间处理机制，那它具体是怎样工作的，又有怎样的原理呢？
var ajax=function(url,fnSucceed,fnFail){
???//第一步：初始化http协议，即实例化一个XMLHttpRequest方法。
???//这里还需要做判断，因为微软的老版本IE（＜IE7）与众不同的是，它的ajax是通过一个ActiveXObject控件实现的，
???//并不是其他浏览器的XMLHttpRequest，这是一种兼容写法。现在其实可以就用XMLHttpRequest来，毕竟连阿里都宣布
???//不支持IE8以下的了。
???if(window.XMLHttpRequest){
???????var oAjax=new XMLHttpRequest();
???}
???else{
???????var oAjax=new ActiveXObject("Microsoft.XMLHTTP");
???}
???//第二步：设置发起请求的内容，方式，要访问哪里？哪个url？是要读还是写？（即get 还是 post）是同步还是异步？
???oAjax.open(‘GET‘,url,true);
???//true是异步，要同步就是false，
???//get一般用于读取服务器数据或资源文件。
???//post一般则是用于用户上传数据时回传至服务器，但这两个实际上都是可读可写，只不过是数据传送的方式不同，
???// 之所以人们一般会这样用主要体现在下面这些方面：
???// 1、get是通过地址栏传输（可以仔细看我们浏览器的上方地址栏，里面的信息会包括一些比较机密的信息，比如：
???// 当用户注册后的信息，如果此时用get进行提交会发生什么呢？你看最上方的地址栏，里面显示的恰恰好是你的账户跟
???// 密码，这就很恐怖了，也非常不安全），而post是通过报文传输，数据不会在地址栏显示，会帮你把提交的数据隐藏，
???// 相对来说比较安全，get中的url有长度限制，最大长度是2k，也就是2048个字符，而post则无限制，
???// 而说到这你可能就会说了，既然post方式这么多优点，那为啥不都用post就可以了？
???// 你又错了，是的，post本身也是有限制的，比如：
???// 你在浏览网页的时候点快了，要后退刷新什么的，用get呢因为他本质上是获取服务上的资源，而你后退实际上并没有
???//要获取服务器上资源的意思（浏览器读得懂），而用post呢？post本质是什么呢？是向服务器提交资源或数据，所以用
???//post的时候，你后退了，浏览器还以为你又要提交什么东西，那它就会把数据再重新提交给服务器，造成重复提交数据
???//说到本质上的东西，你现在知道为什么get有2k的限制了吧？get就是获取，由于对于一个服务器上的资源的获取实际上
???// 是获取资源的url或者再本质点就是一个标识符，资源标识（url不代表就是资源的实际物理地址），这个一般不会太长，
???//也没必要太长，你见过地址栏的东西有一大串一大串的吗？没有吧？而post呢？还是回归本质，英文的意思是什么呢？
???//帖子，投递，说白了就是上传或提交，我想当初ajax底层XMLHttpRequest他们的作者也肯定希望我们用post就是用来投递，
???//用来提交资源的，而get(得到)就是用来获取资源的，它们既然这样想，在设计程序的时候肯定也是这样设计的了，关于
???// 这两个不必要研究太深入，只需要牢记语义化，get 读取资源，post 提交资源，这样你就可以搞定9成9的ajax请求了，
???//而这，够了！我们不是科学家，钻牛角尖的东西，钻到一定程度就够了，当然如果你有时间推荐深入去研究，好事。
???//第三步：发送请求。
???oAjax.send();
???//第四步：处理请求
???/**这第4步有个大坑，什么坑呢？既然是响应终端客户操作的交互请求，那客户什么时候操作呢？我们不知道，服务器也
????* 不会知道。那怎么办呢？如果你学过java，有四个字你一定不陌生，说到这你可能想到了，没错，就是事件监听
????* 但我们这个ajax呢？它不是这样的，它采用的是js里一直被其他程序语言开发者诟病的回调机制，具体是怎样的呢？
????*
????* 我们刚刚开头实例化了一个XMLHttpRequest，它提供了三个属性：
????* 1、onreadystatechange：拆开看 on readystate change，当readystate这个属性变化的时候，调用这个函数
????* ???????????????????????是的，你没翻译错，它就是一个函数，一个回调函数，一个存储了我们预先设置好当用户
????* ???????????????????????发起请求后我们要做（或者说服务器要做）的响应操作，一句话，存函数的
????*
????* 2、readyState：刚刚你是不是在纳闷，我为啥要那样翻译呢？而不是on ready state change呢？看到这个你恍然大悟
????* ???????????????了吧？嘿嘿，其实正确的翻译还真是第2次翻译的这个，就是当预备的状态改变时，只不过预备的状态
????* ???????????????我就当成这个了，这样你印象会比较深，没错，语义化，readyState这个就是XMLHttpRequest的状态
????* ???这个readyState的状态是预先约定俗成好的，类似于协议这样，可以当成一个switch开关，它有几个case，没错
????* ???就是这么任性，这么认为没问题的，具体是哪几个case呢？
????* ???0：请求未初始化
????* ???1：服务器连接已建立
????* ???2：请求已接收
????* ???3：请求处理中
????* ???4：请求已完成，且响应已就绪。（这个用得比较多，毕竟服务器内部的我们并不关心，我们只关心结果）
????*
????* 3、status：这个也是一个状态，它的可填属性呢，有一大堆：0**（未初始化），1**（请求收到，继续处理），2**，
????* ???????????3**，4**，5**，太多了这里就不列举了，有个statusText状态表可自行去查，不过想说的是一般情况下，
????* ???????????服务器对数据的处理，响应我们没必要去管它到底是执行到哪一步了？（数据接收不到调试的话除外）
????* ???????????我们只需要判断它是否接收完请求，并是否能成功做出响应就可以了，所以呢，我们记住几个常用的就可
????* ???????????以了，大脑容量有限，我们应该记一些最精华的部分，而不是越多越好，当然必须先明白原理才可以。
????* 这里呢，我列几个吧：
????* ???????????200："OK"，最常用，成功的意思 （开发者可能比较多用这个）
????* ???????????401：请求授权失败
????* ???????????404：未找到页面
????* ???????????500：服务器产生内部错误
????* ???????????12029：网络不通
????*
????* 啰嗦了这么多，没实操怎么行呢？
????* */
???oAjax.onreadystatechange=function(){
???????if(oAjax.readyState==4){
???????????if(oAjax.status==200){
???????????????fnSucceed(oAjax.responseText);//响应成功回调的函数，这里只是简简单单的返回了一串数据，
??????????????????????????????????????????????//可以在里面或外部的函数里继续写其他响应操作
???????????}
???????????else{
???????????????if(fnFail){
???????????????????fnFail(oAjax.status);
???????????????}
???????????}
???????}
???};//我们这里存了一个函数了
};
下面贴一个自己写的代码（其实上面都有了，只不过比较杂）
/** * Created by Administrator on 2018/5/1 0001. */var dc_ajax_g=function(url,fnSucceed,fnFail) { ???//if (window.XMLHttpRequest) { ???????var oAjax = new XMLHttpRequest(); ???//} ???//else { ???// ???var oAjax = new ActiveXObject("Microsoft.XMLHTTP"); ???//}; ???oAjax.open(‘GET‘,url,true); ???oAjax.send(); ???oAjax.onreadystatechange=function(){ ???????if(oAjax.readyState==4){ ???????????if(oAjax.status==200){ ???????????????fnSucceed(oAjax.responseText);//响应成功回调的函数，这里只是简简单单的返回了一串数据， ???????????????//可以在里面或外部的函数里继续写其他响应操作 ???????????} ???????????else{ ???????????????if(fnFail){ ???????????????????fnFail(oAjax.status); ???????????????} ???????????} ???????} ???};};关于ajax原理阐述
原文地址：https://www.cnblogs.com/dorseych/p/8978148.html