XMLHttpRequest

// 惰性模式 : 第一次执行会影响性能,但之后的不会
function getHTTPObject() {
  if (typeof XMLHttpRequest !== "undefined") {
    getHTTPObject = function() {
      return new XMLHttpRequest();
    };
  } else if (typeof ActiveXObject != "undefined") {
    getHTTPObject = function() { 
      return new ActiveXObject("Microsoft.XMLHTTP");
    }
  } else {
    getHTTPObject = function() { 
      throw new Error("你的浏览器不支持ajax");
    }
  }
  return getHTTPObject()
}

function getNewContent() {
  var request = getHTTPObject();
  if (request) {
    /*
     @param 指定请求类型 
     @param 地址
     @param 用于指定请求是否以异步方式发送和处理
    */
    request.open("GET", "example.txt", true);
    request.onreadystatechange = function() {
      if (request.readyState == 4) {
        var para = document.createElement("p");
        var txt = document.createTextNode(request.responseText);
        para.appendChild(txt);
      }
    };
  }
}

// json转url
function jsonToUrl(json) {
  var arr = [];
  json.t = Math.random();
  for (var name in json) {
    arr.push(name + "=" + encodeURIComponent(json[name]));
  }
  return arr.join("&");
}

function ajax(options) {
  // 解析参数
  options = options || {};
  if (!options.url) return;
  options.type = options.type || "get";
  options.timeout = options.timeout || 0;
  var data = options.data || {};
  // 1 创建ajax
  var xhr = getHTTPObject();
  // 2 连接
  if (options.type === "get") {
    var str = jsonToUrl(data);
    xhr.open("get", `${options.url}?${str}`, true);
    // 3 发送
    xhr.send();
  } else {
    xhr.open("post", options.url, true);
    // 请求头
    xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    // 3 发送
    xhr.send(data);
  }
  // 接收
  xhr.onreadystatechange = function() {
    // 完成
    if (xhr.readyState === 4) {
      // 清除定时器
      clearTimeout(timer);
      if ((xhr.status >= 200 && xhr.status < 300) || xhr.status == 304) {
        // 成功
        options.success && options.success(xhr.responseText);
      } else {
        options.error && options.error(xhr.status);
      }
    }
  };
  // 超时
  if (options.timeout) {
    var timer = setTimeout(function() {
      alert("超时了");
      xhr.abort(); // 终止
    }, options.timeout);
  }
}

你可能感兴趣的:(XMLHttpRequest)