好久没有这么勤快的写过这么多东西了，嘿嘿，今天做一个简单的ajax封装，还涉及到IE的一些兼容问题,可以帮助小伙伴们更深一层的理解ajax，废话不多说了，现在进入正题：
XMLHttpRequest在绝大多数浏览器下都支持。而IE第版本下（ie6）不支持该构造函数，需要使用ActiveXObject该构造函数需要使用对应的参数构造通信对象[“MSXML.XMLHttp.6.0”,”MSXML.XMLHttp.3.0”,”MSXML.XMLHttp”]
首先创建对象函数
以上代码可能对于一些初学者还有有些困难，这边把我认为的难点再详细说一下，关于IE低浏览器的ActiveXObject对象有好几个版本，不能确定，所以用try...catch(e)来做了处理，一旦出了差错就扔到try....catch(e)里面来处理，就不会报错，这样就不会对程序造成影响，要是符合的直接返回，拿来用就可以了，为了以防万一要是个别的浏览器不支持ajax，直接输出 浏览器不支持ajax请求 就可以了。
上面所述都是ajax的准备工作，开始正式封装ajax :
postRequest函数中参数分别代表的含义：
data代表向后台发送要请求什么数据；
type代表的请求方式 请求方式有两种“get”，”post”；
url代表文件的地址
isAsyn代表是同步还是异步
callback代表回调函数，等数据请求完毕，然后执行这个函数
这是刚开始忙活了一半天的createXhr()对象函数
监听数据的变化，一旦status状态吗发送正常且成功，就用readyState属性 等于4的时候，来用responseText接受数据，之后用回调函数来处理数据渲染到页面；注意：为什么说必须在open()之前指定onreadystatechange事件？因为onchangestatechang事件只有在open()之前调才能确保跨浏览器兼容性。Onreadystatechage事件处理程序中使用了xhr对象，没有使用this对象，原因是onreadystatechange事件处理程序的的作用域问题，如果使用this对象，在有的浏览器中使用会导致函数执行失败，或者导致错误发生。因此，使用实际的xhr对象实例变量是较为可靠的一种方式。
用if语句来区分type是get还是post，因为get和post的传参格式是不同的
初始化通信open里面的参数同上
发送请求send里面的参数同上,既要作为请求主体发送的数据，如果不需要通过请求主题发送数据，则必须传入null，因为这个参数对有些浏览器来说是必须的
Ajax一个简单的封装完成了，有什么不足的地方或者有疑问可以评论和相互沟通
网友评论