ajax不是一种新的编程语言，而是使用现有标准的新方法。ajax可以在不重新加载整个页面的情况下，与服务器交换数据。这种异步交互的方式，使用户单击后，不必刷新页面也能获取新数据。
xmlhttprequest对象
ajax的核心是xmlhttprequest对象(xhr)。xhr为向服务器发送请求和解析服务器响应提供了接口。能够以异步方式从服务器获取新数据。
在浏览器中创建对象(只支持ie7及更高的版本)：
var xhr = new xmlhttprequest();
xhr的用法
首先要介绍的是open()方法。它接收3个参数：
•要发送的请求的类型(post、get等)
•请求的url
•表示是否异步发送请求的布尔值
调用open()示例：
xhr.open(get, index.jsp, false);
针对index.jsp的get请求。url相对于执行代码的当前页面；调用open()方法并不会真正发送请求，只是启动一个请求以备发送。
调用send()发送请求：
xhr.send(null);
send()接收一个参数，即要作为请求主体发送的数据。如果不需要通过请求主体发送数据，则必须传入null。
相应数据会填充到xhr对象的相关属性：
•responsetext:作为响应主体被返回的文本
•responsexml:作为响应的内容类型是“text/xml”或“application/xml”
•status:响应的http状态
•statustext:http状态的说明
在接收响应后，首先检查status属性，确定响应已经返回，一般200作为成功的标志。状态码304表示资源没有修改，可以直接使用浏览器中缓存的版本。
为了接收到合适的响应，应该以如下方式检测两种状态码：
xhr.open(get, index.jsp, false); xhr.send(null); if ((xhr.status >= 200 && xhr.status < 300) || xhr.status == 304) { alert(xhr.responsetext); } else { alert("request was unsuccessful: " + xhr.status); }
通过检测readystate属性，可以确定请求/响应过程的当前活动阶段。
•0：未初始化。未调用open()方法
•1：启动。已经调用open()方法，未调用send()方法
•2：发送。已经调用send()方法，未接收到响应
•3：接收。已经接收到部分数据
•4：完成。已经接收到全部数据，可以在客户端使用
readystate属性的值发生变化时，都会触发一次readystatechange事件。在调用open()之前指定onreadystatechange事件处理程序才能确保浏览器兼容性。
var xhr = new xmlhttprequest(); xhr.onreadystatechange = function () { if (xhr.readystate == 4) { if ((xhr.status >= 200 && xhr.status < 300) || xhr.status == 304) { alert(xhr.responsetext); } else { alert(请求成功： + xhr.status); } } }; xhr.open(get, index.jsp, true); xhr.send(null);
在接收响应之前，可以取消异步请求：
xhr.abort();
http头部信息
xhr对象提供了操作请求头部和响应头部信息的方法。
默认情况下，在发送xhr请求的同时，还会发送下列头部信息。
•accept:浏览器能够处理的内容类型
•accept-charset:浏览器能够显示的字符集
•accept-encoding:浏览器能够处理的压缩编码
•accept-language:浏览器当前设置的语言
•connection:浏览器与服务器之间连接的类型
•cookie:当前页面设置的任何cookie
•host:发出请求的页面所在的域
•referer:发出请求的页面的url
•user-aent:浏览器的用户代理字符串
使用setrequestheader()可以设置自定义的请求头部信息。必须在调用open()方法之后，且在调用send()之前，调用
setrequestheader()：
xhr.open(get, index.jsp, true); xhr.setrequestheader(myheader, myvalue); xhr.send(null);
调用getresponseheader()并传入字段名称，可以取得相应的响应头部信息。getallresponseheader()取得包含所有头部信息的长字符串。
var myheader = xhr.getresponseheader(myheader); var allheaders = xhr.getallresponseheader();
get请求
get用于向服务器查询某些信息。可以将查询字符串参数追加到url的末尾，查询字符串中的每个参数的名称和值都必须使用encodeuricomponent()编码：
xhr.open(get, login.jsp?name1=value1&name2=value2, false); addurlparam()接收三个参数：要添加参数的url、参数的名称和参数的值。 var url = login.jsp; // 添加参数 url = addurlparam(url, username, xxyh); url = addurlparam(url, password, xxyh123); // 初始化请求 xhr.open(get, url, false);
post请求
post请求用于向服务器发送应该被保存的数据。post请求的主体可以包含非常多的数据，而且格式不限。
初始化请求：
xhr.open(post, login.jsp, true); 首先将content-type头部信息设置为application/x-www-form-urlencoded,然后建立一个字符串格式。如果需要将页面中的表单数据进行序列化，然后再通过xhr发送到服务器，可以使用serialize()函数来创建这个字符串： xhr.open(get, login.jsp, false); xhr.setrequestheader(content-type, application/x-www-form-urlencoded); var form = document.getelementbyid(user-info); xhr.send(serialize(form));
相信看了本文案例你已经掌握了方法，更多精彩请关注其它相关文章！
推荐阅读：
jquery+ajax实现调用后台步骤详解
jquery调用ajax加载图片
以上就是详细解析js中ajax的使用技巧的详细内容。