创建 XMLHttpRequest 实例需兼容旧版 IE：优先用 new XMLHttpRequest()，IE5/6 回退 ActiveXObject；open() 的 async 参数必须为 true（异步），禁用 false（同步）；监听响应须结合 onload 或 onloadend 与 status 判断，避免解析错误页。
创建 XMLHttpRequest 实例必须检查兼容性
现代浏览器（IE7+、Chrome、Firefox、Safari、Opera）都支持 new XMLHttpRequest()，但旧版 IE5/6 只能用 ActiveXObject("Microsoft.XMLHTTP")。不加判断直接写 new XMLHttpRequest() 在 IE6 下会报 ReferenceError: XMLHttpRequest is not defined。
实际项目中仍需兜底，尤其面向政企或内网系统时。推荐写法：
let xhr;
if (window.XMLHttpRequest) {
xhr = new XMLHttpRequest();
} else {
// IE6/5
try {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {
throw new Error("当前浏览器不支持 XMLHttpRequest");
}
}
open() 的第三个参数 async 决定阻塞与否
xhr.open(method, url, async) 中的 async 参数默认为 true（异步），但若设为 false，脚本会阻塞等待响应完成，UI 完全卡死，现代开发中严禁使用。
- 异步（
true）：请求发出去后立即继续执行后续 JS，靠事件监听响应 - 同步（
false）：JS 执行暂停，直到服务器返回，status和response才可用 - Chrome 已在 DevTools 控制台对同步 XHR 发出警告；Firefox 86+ 完全禁用主线程同步请求
监听响应不能只靠 loadend，status 判断必不可少
loadend 事件在请求结束时触发（无论成功失败），但它不区分 HTTP 状态码。常见错误是直接解析 xhr.response，结果遇到 404 或 500 时抛出 SyntaxError: Unexpected token（因返回的是 HTML 错误页而非 JSON）。
立即学习“前端免费学习笔记（深入）”；
正确做法是结合 onload（仅成功）或 onloadend + 显式状态判断：
xhr.onload = function() {
if (xhr.status >= 200 && xhr.status < 300) {
console.log(xhr.response);
} else {
console.error("HTTP 错误:", xhr.status, xhr.statusText);
}
};
xhr.onerror = function() {
console.error("网络错误，无法连接服务器");
};
GET 请求的查询参数必须手动拼接，URL 编码不能省
xhr.open() 不处理参数，所有查询参数（如 userId=1&completed=false）必须手动拼到 URL 后，并确保值经过 encodeURIComponent()。否则中文、空格、& 等字符会导致后端解析失败或 400 错误。
错误示例：xhr.open('GET', '/api/todos?title=我的任务&status=done') → 我的任务 未编码，URL 中断在第一个 & 前。
正确写法：
const params = new URLSearchParams({
userId: 1,
completed: false,
title: "我的任务"
});
xhr.open('GET', '/api/todos?' + params.toString());
注意：URLSearchParams 兼容性较好（IE 不支持，需 polyfill 或手写编码逻辑），但比字符串拼接更安全可靠。
最容易被忽略的是：没有设置 xhr.responseType 却直接用 JSON.parse(xhr.response) —— 默认 responseType 是 ""（即 text），对大响应体可能引发内存暴涨；而设为 "json" 后，xhr.response 直接是解析好的对象，但失败时为 null，需额外判空。
