ajax 返回的状态

参考回答：

0 － (未初始化) 还没有调用send()方法

1 － (载入) 已调用 send()方法， 正在发送请求

2 － (载入完成) send()方法执行完成， 已经接收到全部响应内容

3 － (交互) 正在解析响应内容

4 － (完成) 响应内容解析完成， 可以在客户端调用了

如何实现 ajax 请求， 假如我有多个请求， 我需要让这些 ajax 请求按照某种顺序一次执行， 有什么办法呢？ 如何处理 ajax 跨域？

参考回答：

通过实例化一个 XMLHttpRequest 对象得到一个实例， 调用实例的 open 方法为这次 ajax 请求设定相应的 http 方法， 相应的地址和是否异步， 以异步为例， 调用send 方法， 这 个方法可以设定需要发送的报文主体。

然后通过监听 readystatechange 事件，通过这个实例 的 readyState 属性来判断这个 ajax 请求状态，其中分为 0，1，2，3，4 这四种状态 ( 0 未初始化，1 载入/正在发送请求 2 载入完成/数据接收，3 交互/解析数据，4 接收数据完 成) ， 当状态为 4 的时候也就是接受数据完成的时候， 这时候可以通过实例的 status 属 性判断这个请求是否成功。

var xhr = new XMLHttpRequest();

xhr.open('get', 'aabb.php', true);

xhr.send(null);

xhr.onreadystatechange = function() {

if(xhr.readyState==4) {

if(xhr.status==200) {

console.log(xhr.responseText);

}

}

}

使 ajax 请求按照队列顺序执行， 通过调用递归函数：

//按顺序执行多个 ajax 命令， 因为数量不定， 所以采用递归

function send(action, arg2) {

//将多个命令按顺序封装成数组对象， 递归执行

//利用了 deferred 对象控制回调函数的特点

$.when(send_action(action[0], arg2))

.done(function () {

//前一个 ajax 回调函数完毕之后判断队列长度

if (action.length > 1) {

//队列长度大于 1， 则弹出第一个， 继续递归执行该队列

action.shift();

send(action, arg2);

}

}).fail(function (){

//队列中元素请求失败后的逻辑

//

//重试发送

//send(action, arg2);

//

//忽略错误进行下个

//if (action.length > 1) {

//队列长度大于 1， 则弹出第一个， 继续递归执行该队列

// action.shift();

// send(action, arg2);

//}

});

}

//处理每个命令的 ajax 请求以及回调函数

function send_action(command, arg2) {

var dtd = $.Deferred();//定义 deferred 对象

$.post(

"url",

{

command: command

arg2: arg2

}

).done(function (json) {

json = $.parseJSON(json);

//每次请求回调函数的处理逻辑

//

//

//

//逻辑结束

dtd.resolve();

}).fail(function (){

//ajax 请求失败的逻辑

dtd.reject();

});

return dtd.promise();//返回 Deferred 对象的 promise， 防止在外部

写出原生 Ajax

参考回答：

Ajax 能够在不重新加载整个页面的情况下与服务器交换数据并更新部分网页内容，实现 局部刷新， 大大降低了资源的浪费， 是一 门用于快速创建动态网页的技术， ajax 的使用 分为四部分：

1 、创建 XMLHttpRequest 对象 var xhr = new XMLHttpRequest();

2 、 向服务器发送请求， 使用 xmlHttpRequest 对象的 open 和 send 方法，

3 、监听状态变化， 执行相应回调函数

var xhr = new XMLHttpRequest();

xhr.open('get', 'aabb.php', true);

xhr.send(null);

xhr.onreadystatechange = function() {

if(xhr.readyState==4) {

if(xhr.status==200) {

console.log(xhr.responseText);

}

}

}

如何实现一个 ajax 请求？ 如果我想发出两个有顺序的 ajax 需要怎么做？

参考回答：

AJAX 创建异步对象 XMLHttpRequest

操作 XMLHttpRequest 对象

( 1) 设置请求参数 (请求方式， 请求页面的相对路径， 是否异步)

( 2) 设置回调函数，一个处理服务器响应的函数，使用 onreadystatechange ，类似函数 指针

( 3) 获取异步对象的 readyState 属性： 该属性存有服务器响应的状态信息 。每当 readyState 改变时， onreadystatechange 函数就会被执行。

( 4) 判断响应报文的状态， 若为 200 说明服务器正常运行并返回响应数据。

( 5) 读取响应数据， 可以通过 responseText 属性来取回由服务器返回的数据。

发出两个有顺序的 ajax， 可以用回调函数， 也可以使用 Promise.then 或者 async 等。

Fetch 和 Ajax 比有什么优缺点？

参考回答：

promise 方便异步， 在不想用 jQuery 的情况下， 相比原生的 ajax， 也比较好写。