ajax
1.ajax
ajax: 异步Javascript和XML
发送请求以及异步的方式, 传递的传输形式: xml(早期), json(现在流行)
后台响应学生信息的数据给前端:
java: Student类: id属性,name属性, sex属性,age属性…
跨语言数据传输:
“1,张三,男,18” --> 数据
直接传输
问题:
- 每个数据的含义不清楚,
- 发送数据, 手动把对象转换为字符串, 获取数据: 解析字符串
xml格式: 自定义标签
"<student id='1' name='张三' age='18' sex='男' ></student>"
优点: 每个数据的含义清晰
缺点:
发送数据, 手动把对象转换为xml 获取数据: 解析xml 前端: dom解析
json格式
{"id":1,"name":"张三","age":18,"sex":"男"}
优点: 每个数据的含义清晰, 对前端友好: 前端不需要解析, 变成一个js对象
缺点:
发送数据, 手动把对象转换为json格式的字符串
AJax的两大特点:
- 异步通信
- 局部刷新
2.异步通信, 同步通信
3.原生的javascript写ajax 了解
- 代码量大
- 浏览器兼容性问题
Ajax核心对象: XMLHttpRequest (xhr)
4.JQuery 的Ajax
1 $.ajax()
参数:
data : String /Object: 请求参数,客户端发送给服务器的数据
dataType: String 服务器响应的数据类型
“xml”: 返回 XML 文档,可用 jQuery 处理。
“html”: 返回纯文本 HTML 信息;包含的script标签会在插入dom时执行。
“script”: 返回纯文本 JavaScript 代码。不会自动缓存结果。除非设置了"cache"参数。‘’‘注意:’''在远程请求时(不在同一个域下),所有POST请求都将转为GET请求。(因为将使用DOM的script标签来加载)
“json”: 返回 JSON 数据 。
“jsonp”: JSONP 格式 解决跨域
“text”: 返回纯文本字符串
success(data, textStatus, jqXHR) function 成功之后的回调函数:
data: 参数名: 接收服务器给ajax请求的响应的数据 , 任意取
error: function, 服务器响应的失败的回调函数
type: String 提交方式 (默认: “GET”) 请求方式 (“POST” 或 “GET”),
url: String 请求的url地址
Ajax请求,要求后台响应数据, 不能重定向转发页面, 通过响应对象的响应输出流写出数据
JSON 与转换
1.JSON
//创建对象 js对象
var stu = { id: 1, name: "张三"}
//构造方法
function Person(name,id){
this.name = name;
this.id = id;
}
//构造函数方式
var p1 = new Person('李四',1);
//json字符串
var json = '{ "id": 1, "name": "张三"}';
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-FKDgh1Yv-1667219811792)(笔记.assets/image-20221027091206392.png)]
JSON语法格式:
- 数据以key/value对存储, key:value
- 数据与数据之间使用逗号分割: k1:v1,k2:v2
- 使用
{}
表示一个对象{"id":1,"name":"张三"}
- 使用
[]
表示一个数组{"id":1,"name":"张三","loves":["read","music"]}
stus:[{"id":1,"name":"张三"},{"id":2,"name":"李四",sex:null}]
注意:
- key一定使用双引号引起
- 如果value是字符串,一定使用双引号引起
JSON值:
- 数字(整数或浮点数)
- 字符串(在双引号中)
- 逻辑值(true 或 false)
- 数组(在方括号中
[]
) - 对象(在花括号中
{}
) - null
2.ES5语法中 JSON类
JSON.parse(json字符串): 把JSON字符串转换为js对象
JSON.stringify(js对象): 把js对象转换为JSON格式字符串
JQuery中:
$.parseJSON(json字符串): 把json字符串转换为js对象, 该方法在jquery3.0 以后的版本删除
3.java对象与json的转换
借助第三方的jar: fastJson, jackson, json-lib…
课件: fastJson: 阿里巴巴的
核心类: JSON
核心方法:
把json字符串转换为java对象: parseObject()
把对象数组形式json字符串转换为java的List集合: parseArray()
把java对象转换为json字符串: toJSONString()