我们知道 Ajax 的底层实现其实是很简单的(抛开IE不说),标准的 w3c 直接提供了 XMLHttpRequest 方法。我们主要站在设计的角度来理解,如何设计出低耦合高内聚的代码 jQuery 对 Ajax 的处理主要体现在对浏览器兼容,数据的处理过滤以及各种事件的封装上,主要有以下几部分扩展:
提供快捷接口 提供底层接口 提供数据序列化 提供全局 Ajax 事件处理
分析下面一个demo
给 document 绑定 ajaxStart、ajaxComplete 回调事件,trigger 绑定一个点击事件。通过 click 触发事件发送一个 ajax 请求,并且通过 complete、done、ajaxStart、ajaxComplete 返回状态回调。
$(document).ajaxStart(function() { console.log(arguments) }).ajaxComplete(function() { $(".log").text("Triggered ajaxComplete handler."); }); $(".trigger").click(function() { //发送ajax请求 $.ajax({ url: "php.html", context: document.body, complete: function() { console.log(this) } }).done(function() { console.log(this) }); });
这里实现比较特别的地方,针对 ajax 提供 3 种回调方式:
换句话说,针对ajax的请求,每一步的状态、成功、失败或者进行中,我们有 3 种方式可以监听,但是每一种还是有各自的区别:
那么我们思考下为什么要设计这么多接口?这么多功能怎么融合在一起的?
请验证,完成请求
由于请求次数过多,请先验证,完成再次请求
打开微信扫码自动绑定
绑定后可得到
使用 Ctrl+D 可将课程添加到书签
举报