onreadystatechange 属性

onreadystatechange 属性是 XMLHttpRequest 对象的一个事件处理器，用于在 XMLHttpRequest 对象的 readyState 属性发生变化时触发。这个属性通常用于异步地获取和处理服务器的响应。以下是关于 onreadystatechange 属性的详细解释：

定义与用途#

• 定义：onreadystatechange 是一个事件处理器，它指定了一个函数，该函数会在 XMLHttpRequest 对象的 readyState 属性发生变化时被调用。
• 用途：由于 AJAX 请求是异步的，客户端无法立即知道请求何时完成或结果何时可用。onreadystatechange 事件提供了一种机制，使得当请求的某个状态发生变化时，可以执行相应的代码。

触发时机#

• onreadystatechange 事件会在 readyState 属性的值从 0 到 4 之间的任何一个值变化时触发。这意味着该事件可能会被触发多次，每次 readyState 的值发生变化时都会触发。

readyState 的值#

• readyState 是一个整数，表示请求的不同状态：
  1. UNSENT (0): 初始状态，open() 方法还没有被调用。
  2. OPENED (1): 已经调用 open() 方法，但还未调用 send() 方法。
  3. HEADERS_RECEIVED (2): 已经调用 send() 方法，并且已经接收到服务器的响应头。
  4. LOADING (3): 正在接收响应体（即服务器返回的数据）。
  5. DONE (4): 请求已完成，无论成功还是失败。

典型用法#

通常，onreadystatechange 事件处理器会检查 readyState 的值，并在其等于 4（即请求已完成）时，进一步检查 status 属性（表示 HTTP 响应状态码）来确定请求是否成功。如果 status 为 200（表示请求成功），则可以处理服务器返回的数据。

var xhr = new XMLHttpRequest();  
xhr.onreadystatechange = function() {  
  if (xhr.readyState === 4) { // 请求已完成  
    if (xhr.status === 200) { // 请求成功  
      console.log(xhr.responseText); // 处理服务器返回的数据  
    } else {  
      // 处理错误情况  
    }  
  }  
};  
xhr.open('GET', 'some_url', true);  
xhr.send();

总结#

onreadystatechange 属性为开发者提供了一种机制，用于在 AJAX 请求的不同阶段执行相应的代码。通过检查 readyState 和 status 属性的值，可以确定请求的状态和结果，并据此采取相应的操作。