首页 » Web前端 » phpajax队列技巧_前端工程师常见面试题前端核心Ajax

phpajax队列技巧_前端工程师常见面试题前端核心Ajax

访客 2024-12-05 0

扫一扫用手机浏览

文章目录 [+]

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

1 - (载入) 已调用 send()方法, 正在发送要求

phpajax队列技巧_前端工程师常见面试题前端核心Ajax

2 - (载入完成) send()方法实行完成, 已经吸收到全部相应内容

phpajax队列技巧_前端工程师常见面试题前端核心Ajax
(图片来自网络侵删)

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: commandarg2: 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, 也比较好写。

标签:

相关文章