js兼容所有浏览器的ajax请求写法

以下是一个兼容所有浏览器的 Ajax 请求的示例代码：

function createXHR() {
  if (typeof XMLHttpRequest !== 'undefined') {
    return new XMLHttpRequest();
  } else if (typeof ActiveXObject !== 'undefined') {
    if (typeof arguments.callee.activeXString !== 'string') {
      var versions = [
        'MSXML2.XMLHttp.6.0',
        'MSXML2.XMLHttp.3.0',
        'MSXML2.XMLHttp'
      ];
      for (var i = 0, len = versions.length; i < len; i++) {
        try {
          new ActiveXObject(versions[i]);
          arguments.callee.activeXString = versions[i];
          break;
        } catch (ex) {
          // skip
        }
      }
    }
    return new ActiveXObject(arguments.callee.activeXString);
  } else {
    throw new Error('No XHR object available.');
  }
}

function ajax(options) {
  options = options || {};
  options.type = (options.type || 'GET').toUpperCase();
  options.dataType = options.dataType || 'json';
  var params = formatParams(options.data);
  var xhr = createXHR();

  xhr.onreadystatechange = function () {
    if (xhr.readyState === 4) {
      var status = xhr.status;
      if (status >= 200 && status < 300) {
        var response = xhr.responseText;
        if (options.dataType === 'json') {
          response = JSON.parse(response);
        }
        options.success && options.success(response, xhr);
      } else {
        options.error && options.error(status, xhr);
      }
    }
  };

  if (options.type === 'GET') {
    xhr.open('GET', options.url + '?' + params, true);
    xhr.send(null);
  } else if (options.type === 'POST') {
    xhr.open('POST', options.url, true);
    xhr.setRequestHeader(
      'Content-Type',
      'application/x-www-form-urlencoded'
    );
    xhr.send(params);
  }
}

function formatParams(data) {
  var arr = [];
  for (var name in data) {
    arr.push(
      encodeURIComponent(name) + '=' + encodeURIComponent(data[name])
    );
  }
  arr.push(('v=' + Math.random()).replace('.', ''));
  return arr.join('&');
}

使用示例：

ajax({
  url: 'your_url',
  type: 'POST',
  data: {
    name: 'John',
    age: '20'
  },
  dataType: 'json',
  success: function (response, xhr) {
    console.log(response);
  },
  error: function (status, xhr) {
    console.log('Error: ' + status);
  }
});

这段代码使用了原生的 XMLHttpRequest 对象，如果不支持，则会尝试使用 ActiveXObject 来创建一个兼容 IE6 及更早版本的对象。同时也对 GET 和 POST 两种请求方式进行了兼容处理。