创建 XMLHttpRequest 对象

// 兼容写法
if (window.XMLHttpRequest) {
 //  IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
 xmlhttp=new XMLHttpRequest();
} else {
 // IE6, IE5 浏览器执行代码
 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}

设置请求的类型，URL以及是否异步(async)

xmlhttp.open("GET", "/article/page", true);
xmlhttp.open("POST", "/article/add", true);

备注： （1）当请求类型为GET时，传递的参数可直接放在URL的查询字符串中；POST请求的参数需要传入xmlhttp.send方法 （2）推荐设置async为true，使用异步的方式进行处理，需要通过onreadystatechange监听请求状态；如果async为false，则请求是同步的，就不需要监听请求状态了，直接在xmlhttp.send方法后写处理代码就可以了，但是同步请求是会阻塞的，此时浏览器看起来就像卡死了一样，没特殊情况千万别用同步请求。

设置请求头

xmlhttp.setRequestHeader(HTTP 头名称，HTTP请求头值)，举个示例：

xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

监听请求状态

xmlhttp.onreadystatechange= function(){
  if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
     // 请求成功，进行业务处理
     // ......
  }
}

备注：

readyState有五种状态：

• 0: 请求未初始化
• 1: 服务器连接已建立
• 2: 请求已接收
• 3: 请求处理中
• 4: 请求已完成，且响应已就绪

我们主要关注状态4

发送请求

xmlhttp.send()，该方法可以携带POST请求的参数，参数写法也是查询字符串格式，示例：

xmlhttp.send('username=Tusi&password=999999')