学习AJAX笔记

不断学习——

于 2020-12-30 17:36:36 发布

阅读量117

点赞数

分类专栏：笔记

本文链接：https://blog.csdn.net/weixin_45749653/article/details/111995061

版权

笔记专栏收录该内容

10 篇文章 0 订阅

订阅专栏

局部刷新工作原理

1）浏览器内有一个【异步请求对象】代替浏览器将【请求协议包】发送到服务端。
2）服务端返回的【响应包】直接推送到这个【异步请求对象】
3）开发人员从【异步请求对象】取出【相应数据】更新到浏览器指定标签上。

AJAX

AJAX：Asynchronization JavaScript And Xml
帮助开发人员管理浏览器中【异步请求对象】，像是命令【异步请求对象】向服务器发送请求协议包或者读取【异步请求对象】接收的响应数据。

AJAX开发流程：

1.在浏览器内存创建一个【异步请求对象】

var xmlHttp=new XMLHttpRequest();

2.为【异步请求对象】绑定【工作状态监听器】帮助开发人员确认核实从【异步请求对象】上得到服务端返回的响应数据。

obj.监听器=funciton(){
	xmlHttp.onreadystatechange=function(){
	}
};

3.初始化【异步请求对象】
在这里参数有三个
1）.通知【异步请求对象】发送【请求协议包的方式】post/get。
2）.通知【异步请求对象】本次要访问的资源文件地址。
3）.通知【异步请求对象】在其工作期间，浏览器是否会等他。

xmlHttp.open(" "," ",true/false);

4.命令通知【异步请求参数】代替浏览器发送请求。

xmlHttp.send();

异步请求对象工作状态

1.readyState属性:存储当前工作状态。
2.含义：
xmlHttp.readyState 状态
0 异步请求对象已被创建完毕
1 异步请求对象被初始化完毕
2 服务端处理该对象发送的请求
3 异步请求对象已得到响应包中响应体内容
4 异步请求对象解析响应体内容完毕，开发人员可提取数据

从异步请求对象得到相应数据，进行局部刷新

xmlHttp.onreadystatechange=function(){
	//每当事件处理函数被调用时，都需要询问异步请求对象当前工作状态
	if(xmlHttp.readyState==4&&xmlHttp.status==200){
			//读取相应数据
			var data=xmlHttp.responseText;
			callBack(data);
	}
};
//局部刷新实现函数
function callBack(param){
	
}