监听 Ajax 请求需在 onreadystatechange 中判断 readyState === 4 且 status ≥ 200 && status < 300（或含 304），确保响应完成且业务成功。
监听 Ajax 请求状态变化并获取响应，核心是使用 XMLHttpRequest 对象的 onreadystatechange 事件配合 readyState 和 status 两个关键属性判断时机。
监听请求生命周期：readyState 状态码含义
XMLHttpRequest 的 readyState 是一个只读整数，反映请求所处阶段，共 5 个值：
-
0：未初始化 —— XMLHttpRequest 实例已创建，但尚未调用
open() -
1：已打开 ——
open()已执行，请求配置完成 -
2：已发送 ——
send()已调用，请求头已收到（服务器可能还没返回正文） - 3：接收中 —— 响应体正在传输，但尚未接收完毕（可用于流式处理，但兼容性有限）
- 4：完成 —— 响应全部接收完毕，此时才可安全读取数据
只有当 readyState === 4 时，才能确保响应就绪；否则访问 responseText 可能为空或不完整。
判断请求是否成功：status 状态码校验
status 是 HTTP 响应状态码，必须与 readyState === 4 同时判断：
立即学习“Java免费学习笔记（深入）”；
- 200：标准成功响应，最常见
- 304：资源未修改（常用于协商缓存），也可视为逻辑成功
- 4xx：客户端问题（如 401 未授权、404 找不到）
- 5xx：服务端错误（如 500 内部错误、503 服务不可用）
仅靠 readyState === 4 不代表业务成功，比如服务器返回 500 错误时 readyState 也是 4。所以推荐写法是：
if (xhr.readyState === 4) {
if (xhr.status >= 200 && xhr.status < 300 || xhr.status === 304) {
// 成功处理：解析 responseText 或 responseJSON
} else {
// 失败处理：提示错误、重试或跳转
}
}
获取响应数据的常用方式
响应就绪后，根据服务端返回格式选择对应属性：
- responseText：无论内容类型，都以字符串形式返回（最常用，适合 JSON、HTML、纯文本）
-
responseXML：若响应头
Content-Type是text/xml或application/xml，会自动解析为 XML Document 对象（现已较少使用） -
response：原始响应体（类型由
responseType决定，如"json"时直接返回 JS 对象）
注意：responseType = "json" 需在 send() 前设置，且要求服务端返回合法 JSON，否则 response 为 null，仍需靠 responseText 捕获原始错误信息。
完整示例：带错误防护的基础请求
以下是一个最小可行、兼顾状态判断和响应提取的原生 Ajax 片段：
const xhr = new XMLHttpRequest();
xhr.open("GET", "/api/data", true);
xhr.onreadystatechange = function () {
if (xhr.readyState === 4) {
if (xhr.status >= 200 && xhr.status < 300) {
try {
const data = JSON.parse(xhr.responseText);
console.log("获取成功", data);
} catch (e) {
console.error("JSON 解析失败", xhr.responseText);
}
} else {
console.error("HTTP 错误", xhr.status, xhr.statusText);
}
}
};
xhr.send(); 
