流程:
创建ajax引擎对象
声明事件监听:监听ajax对象的属性readystate的值,一旦readystate的值发生改变就会触发声明的函数的执行
ajax的状态码readyState的值:
0:表示ajax引擎对象创建
1: 表示请求创建但是未发送 ajax.open("get", "my");
2: 请求发送ajax.send(null);
3: 请求处理完毕,正在接收响应状态
4: 响应内容接收完毕(重要状态)
ajax响应状态码:ajax.status
200:表示一切正常
404:资源未找到
500:服务器内部错误
ajax之响应数据
服务器响应给浏览器的数据应该是字符串类型
但是如果数据量比较大,我们就需要在服务器端将数据拼接成一个良好格式的字符串数据,响应给浏览器。
浏览器根据格式进行数据的解析和使用。
问题:
什么样的格式算是良好的格式呢?
解决:
使用json格式的字符串
json的概念:
其实json就是js创建对象的一种格式,保证对象中数据的紧密型和 完整性。
json的格式:
var 对象名={
键名:值,
键名:值,
键名:值,
....
键名:值
}
使用:
在服务器端将要响应的数据拼接成json格式的字符串,这样客户端(浏览器端)在接收到响应数据后
可以使用eval方法将json格式的字符串数据直接转化为对应的js对象,便于数据的操作。
我们可以在服务器使用类似Gson的工具包完成json格式字符串的拼接
创建并发送ajax请求
创建ajax请求(设置异步或者同步)
ajax.open(method,url,ansyc);
method:表示请求方式
get方式:请求数据以?隔开的形式拼接在url的后面。
请求数据不能写在send方法中
post方式:
post方式:
post方式需要单独的进行请求数据的设置。使用ajax.setRequestHeader
("Content-Type", "application/x-www-form-urlencoded");
设置请求数据为键值对数据。如果有请求数据则ajax.send("键值对数据&键值对数据....")
如果没有请求数据则ajax.send(null)
url:请求地址
ansyc:设置异步或同步请求,true表示异步,false,表示同步,默认是异步的。
异步:
当前js函数继续执行,无需等待ajax请求的响应以及响应的处理
同步:
当前js函数会等待ajax请求以及响应,当ajax响应处理完毕之后,继续执行函数的剩余代码。
发送ajax请求
// get方式
ajax.send(null);
//post方式
ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
ajax.send("uname=zhangbozhi&pwd=123");
明确流程:
1.创建ajax对象
2 。声明监听函数
//判断ajax状态码
// 判断响应状态码
// 处理响应
3.创建并发送ajax请求
创建请求(设置请求方式,设置请求地址,设置异步或者同步)
发送请求
4. 其他处理
ajax封装
实现:
思想:相同的保留,不同的传参。
请求方式:method
请求方式:url
请求参数:data 请求参数的格式为键值对格式的字符串,不同的键值对使用&符号隔开,如果没有请求数据传入null
示例:"a=1&b=2"
异步同步设置:ansyc
响应处理参数:deal200
该参数接受一个js的函数对象,函数对象中声明ajax响应数据的处理逻辑的代码。
注意:函数对象需要声明一个形参用来接收要处理的响应数据
网友评论