21.AJAX

function ajax(options, callback){
  var xmlhttp = null;
  var url = options.url;
  var method = options.method.toLocaleLowerCase() || 'get';
  var data = options.data
  if (window.XMLHttpRequest) {  // 1.创建XMLHttpRequest对象
    xmlhttp = new XMLHttpRequest();      
    if (xmlhttp.overrideMimeType) {         //针对某些特定版本的mozillar浏览器的BUG进行修正    
      xmlhttp.overrideMimeType("text/xml");     
    }     
  } else if (window.ActiveXObject) {         //针对IE6，IE5.5，IE5        
    var activexName = [ "MSXML2.XMLHTTP", "Microsoft.XMLHTTP" ];         //两个可以用于创建XMLHTTPRequest对象的控件名称，保存在一个js的数组中 
    for ( var i = 0; i < activexName.length; i++) {     
      try {     
        xmlhttp = new ActiveXObject(activexName[i]);   //取出一个控件名进行创建，如果创建成功就终止循环 ，如果创建失败，回抛出异常，然后可以继续循环，继续尝试创建   
        if(xmlhttp){  
           break;  
        }  
      } catch (e) {
        console.log(e)
      }     
    }     
  }
  var paramArr = []
  var encodeData
  if (data instanceof Object) {
    for (var key in data) {
      paramArr.push( encodeURIComponent(key) + '=' + encodeURIComponent(data[key]) ) // 参数拼接需要通过 encodeURIComponent 进行编码
    }
    encodeData = paramArr.join('&')
  }
  if (method === 'get') { // 检测 url 中是否已存在 ? 及其位置
   var index = url.indexOf('?')
   if (index === -1) url += '?'
   else if (index !== url.length -1) url += '&' // 拼接 url
     url += encodeData
  }
  xmlhttp.open(method, url); // 2.使用open方法设置和服务器的交互信息
  if (method === 'get') xmlhttp.send(null) // 3.发送请求
  else {
    xmlhttp.setRequestHeader('Content-Type','application/x-www-form-urlencoded;charset=UTF-8');     // post 方式需要设置请求头
    xmlhttp.send(encodeData)
  }
  xmlhttp.onreadystatechange = function() {  // 响应函数
    if(xmlhttp.readyState ==4 && xmlhttp.status==200) {
      callback(xmlhttp.responseText)
    }
  }
}
function getData(data){
  console.log('请求成功', data)
}
ajax({
    url: 'your request url',
    method: 'get',
    data: {
      name: 'rashomon',
      age: 13
    }
},getData)