1.AJAX
-
同步:提交请求->等待服务器处理->处理完毕返回 这个期间客户端浏览器不能干任何事
-
异步: 请求通过事件触发->服务器处理(这时浏览器仍然可以作其他事情)->处理完毕
同步是指:发送方发出数据后,等接收方发回响应以后才发下一个数据包的通讯方式。
异步是指:发送方发出数据后,不等接收方发回响应,接着发送下 个数据包的通讯方式
Ajax的概念: 发送异步请求
JavaScript 编写发送请求的代码, xml(json): "张三,男,21,1001,20"
Ajax的技术的产生 Ajax被认为是(Asynchronous JavaScript and XML的缩写)。现在,允许浏览器与服务器通信而无须刷新当前页面的技术都被叫做Ajax. 局部刷新
Ajax:一种不用刷新整个页面便可与服务器通讯的办法
Web的传统模型。客户端向服务器发送一个请求,服务器返回整个页面,如此反复
在Ajax模型中,数据在客户端与服务器之间独立传输。服务器不再返回整个页面
不用刷新整个页面便可与服务器通讯的办法: Flash Java applet 框架:如果使用一组框架构造了一个网页,可以只更新其中一个框架,而不必惊动整个页面 隐藏的iframe XMLHttpRequest:该对象是对 JavaScript 的一个扩展,可使网页与服务器进行通信。是创建 Ajax 应用的最佳选择。实际上通常把 Ajax 当成 XMLHttpRequest 对象的代名词
Ajax的核心是JavaScript对象XmlHttpRequest(异步引擎对象)。 该对象在Internet Explorer 5中首次引入,它是一种支持异步请求的技术。简而言之,XmlHttpRequest使您可以使用JavaScript向服务器提出请求并处理响应,而不阻塞用户。
Ajax: 异步通信, 局部刷新
核心对象: XMLHttpRequest对象(异步引擎对象)
原生javaScript代码实现Ajax, 创建XMLHttpRequest对象, 不同浏览器,这个对象的创建方式不一样,浏览器的兼容性
Jquery 的Ajax的封装
$.ajax(url,settings)
url: 请求的url
settings: object
data: String/object 客户端请求服务器,请求参数
datatype: 服务器响应给客户端的数据类型
预期服务器返回的数据类型。如果不指定,jQuery 将自动根据 HTTP 包 MIME 信息来智能判断,比如XML MIME类型就被识别为XML。在1.4中,JSON就会生成一个JavaScript对象,而script则会执行这个脚本。随后服务器端返回的数据会根据这个值解析后,传递给回调函数。可用值:
预期服务器返回的数据类型。如果不指定,jQuery 将自动根据 HTTP 包 MIME 信息来智能判断,比如XML MIME类型就被识别为XML。在1.4中,JSON就会生成一个JavaScript对象,而script则会执行这个脚本。随后服务器端返回的数据会根据这个值解析后,传递给回调函数。可用值: "xml": 返回 XML 文档,可用 jQuery 处理。 "html": 返回纯文本 HTML 信息;包含的script标签会在插入dom时执行。 "script": 返回纯文本 JavaScript 代码。不会自动缓存结果。除非设置了"cache"参数。'''注意:'''在远程请求时(不在同一个域下),所有POST请求都将转为GET请求。(因为将使用DOM的script标签来加载) "**json**": 返回 JSON 数据 。 "jsonp": [JSONP](http://bob.pythonmac.org/archives/2005/12/05/remote-json-jsonp/) 格式。使用 [JSONP](http://bob.pythonmac.org/archives/2005/12/05/remote-json-jsonp/) 形式调用函数时,如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名,以执行回调函数。 "**text**": 返回纯文本字符串success(data, textStatus, jqXHR)Function,Array
请求成功后的回调函数。参数:由服务器返回,并根据dataType参数进行处理后的数据;描述状态的字符串。还有 jqXHR(在jQuery 1.4.x的中,XMLHttpRequest) 对象 。在jQuery 1.5, 成功设置可以接受一个函数数组。每个函数将被依次调用。 Ajax 事件。
function (data, textStatus) { // data 服务器响应的数据 this; // 调用本次AJAX请求时传递的options参数 }
error Function
(默认: 自动判断 (xml 或 html)) 请求失败时调用此函数。有以下三个参数:XMLHttpRequest 对象、错误信息、(可选)捕获的异常对象。如果发生了错误,错误信息(第二个参数)除了得到null之外,还可能是"timeout", "error", "notmodified" 和 "parsererror"。Ajax 事件
function (XMLHttpRequest, textStatus, errorThrown) { // 通常 textStatus 和 errorThrown 之中 // 只有一个会包含信息 this; // 调用本次AJAX请求时传递的options参数 }type String
(默认: "GET") 请求方式 ("POST" 或 "GET"), 默认为 "GET"。注意:其它 HTTP 请求方法,如 PUT 和 DELETE 也可以使用,但仅部分浏览器支持。
url: 请求的url
ajax请求, 需要后台给的数据,
页面: 转发, 重定向方式
数据: response.getWriter()
2.json
html页面: EL表达式, 域对象这些都失效
html页面: 发送ajax请求, 后台的数据, 通过response的输出流响应给前端
后台的数据是java对象, 需要把java对象转换为json格式的字符串, 再通过response的输出流响应给前端
json格式:
指定格式的字符串
{}: 对象
[]:数组/集合
[{},{},{}]
: 对象数组对象中:
"属性名":值
值是字符串,一定要双引号引起, 数值类型,可以省略属性与属性直接: 使用逗号分割,
{"属性名1":值1,"属性名2":值2}
学生类:
public class Student{ private int id; private String name; private String sex; }Student stu = new Student(1,"张三","男"); List<Student> list; 转换为json格式的字符串:
{"id":1,"name":"张三","sex":"男"}[{"id":1,"name":"张三","sex":"男"},{"id":2,"name":"李四","sex":"男"},{"id":3,"name":"李思思","sex":"女"}]{"datas":[{"id":1,"name":"张三","sex":"男"},{"id":2,"name":"李四","sex":"男"},{"id":3,"name":"李思思","sex":"女"}],"totalPage":4,"count":4,"currentPage":1,"pageSize":1}
把java对象转换为json
fastJson 阿里的
jackson 国外的
json-lib 国外的
使用FastJson把java对象转换json:
1.导入fastJson的依赖, 一定要导入最新
在代码中使用JSON类的静态方法. toJSONString() 把java对象转换为json格式字符串
使用T JSON.parseObject(String json, Class<T> clazz) 把json格式的字符串转换为java对象
使用List<T> JSON.parseArray(String json, Class<T> clazz)把json格式的字符串转换为List对象
前台: $.getJSON()