你所不了解的xhr

一、readyState

0: unsend，代理被创建，尚未调用open方法

1: opened，open已调用

2: headers received，send方法已调用，且头部和状态已可活动

3: loading，下载中，respenseText属性保护部分数据

4: done，下载已完成

二、open

五个参数，第一个是method，第一个url，第三个是是否一步，false：send方法知道答复前不会返回

三、代码

代码语言：javascript复制

const xhr = new XMLHttpRequest();
xhr.onreadystatechange = function () {
    console.log('readystate:', xhr.readyState); // 1、2、3....、4
}
xhr.open('get', 'https://img.yuanmabao.com/zijie/pic/2023/05/26/x5mfpjuh0ur.jpg', true);
xhr.send();
xhr.onreadystatechange = function () {
    console.log('readystate:', xhr.readyState); // 2、3....、4
}

四、readyState变化

代码语言：javascript复制

const xhr = new XMLHttpRequest();
xhr.open('get', 'https://img.yuanmabao.com/zijie/pic/2023/05/26/x5mfpjuh0ur.jpg', false);
xhr.onreadystatechange = function () {
    console.log('readystate:', xhr.readyState); // 1、4
}
xhr.onreadystatechange = function () {
    console.log('readystate:', xhr.readyState); // 1、4
}
xhr.send();
xhr.onreadystatechange = function () {
    console.log('readystate:', xhr.readyState); // 无返回
}

javascript 前端 网络 ajaxJavaScript 前端 网络 ajax xhr

0 人点赞