XMLHttpRequest —— 这是什么、怎样完整地执行一次GET请求、怎样检测错误

这是什么?怎样完整地执行一次GET请求?怎样检测错误?


  1. 关于XMLHttpRequest
1.1 作用: 提供了网页加载后在后台与服务器通信的方法;实现AJAX通信;
1.2 创建: var xhr = new XMLHttpRequest();//不适用于IE7之前的版本,其他低版本IE可通过 ActiveXObject构造;
1.3 对象属性: readyState,可取的值见图-1;
1.4 对象事件: readyState的值的改变会触发readyStatechange事件;错误会触发error事件;
1.3 优缺点: 在不重新加载页面的情况下更新网页;
1.4 XMLHttpRequest 2级:
  FromData对象:用来序列化表单或者创建与表单格式相同的数据;其实例可直接传给send()方法使用;
  栗子: var form1 = document.forms[0];
        xhr.send(new FormData(form1));
  1. 一次GET请求分析,并检测执行过程
2.1 异步GET
  var xhr = new XMLHttpRequest();
  xhr.onerror = function(){alert("我出错啦")};
  xhr.onreadystatechange = function(){
    switch(xhr.readyState){
      case 0 : alert("未初始化,及还未调用open方法");
               break;
      case 1 : alert("启动,未调用send方法");
               break;
      case 2 : alert("发送,未收到响应");
               break;
      case 3 : alert("接受,取得部分数据");
               break;
      case 4 : if((xhr.status >=200 && xhr.status < 300) || xhr.status ==304){
                alert(xhr.responceText);
               };
                break;
      default : alert("are you kidding?");
    }
  };
  xhr.open("get", "url", true)//启动一个请求,未发送
  xhr.send(null);//发送请求. 如果该请求是异步模式(默认),该方法会立刻返回. 相反,如果请求是同步模式,则直到请求的响应完全接受以后,该方法才会返回

XMLHttpRequest.readyState可取的值:

XMLHttpRequest —— 这是什么、怎样完整地执行一次GET请求、怎样检测错误_第1张图片
图-1

你可能感兴趣的:(XMLHttpRequest —— 这是什么、怎样完整地执行一次GET请求、怎样检测错误)