[知了堂学习笔记]_Ajax入门

请关注“知了堂学习社区”，地址：http://www.zhiliaotang.com/portal.php
1. Ajax是什么
Ajax相当于在浏览器客户端和服务器之间架设的一个桥梁，在它的帮助下可以消除网络交互过程中的处理—等待—处理的缺陷。
Ajax全称：asynchronous JavaScript and XML，异步JavaScript和xml。
2.Ajax异步交互
2.1浏览器发送请求到客户端。
2.2服务器端通过与后台业务框架进行数据处理。
2.3服务器将处理好的数据转换成XML、JSON、Text，同时将数据发送给客户端。
2.4客户端通过XMLHttpRequest核心对象对数据进行解析处理。
2.5最后再将解析好的数据通过HTML、CSS等技术进行装饰。
具体情况如图：

3.Ajax中的XML的作用
3.1 XML就是一种数据结构，数据模型，而且是有关联关系的数据模型。
3.2 webService应用，就是以XML数据进行数据之间的传递与交互。
3.3 JS解析XML，利用JS DOM将数据放到响应的HTML里面。
4.原生Ajax
4.1 XMLHttpRequest中属性和方法。
4.1.1 responseText:接收服务器端响应文本字符串数据。
4.1.2 responseXML:接收服务器端响应XML格式数据。


4.2 XMLHttpRequest创建
4.2.1 因为Ajax核心对象的创建与浏览器有关系。
4.2.2 IE7+，FireFox，Chrome，Safari创建Ajax对象的方式。
4.2.3 IE5，IE6创建Ajax对象的方式。

4.3 XMLHttpRequest状态属性。
4.3.1 readyState:监控服务器端响应变化的状态。状态变化由数字0~4构成。
0：请求未初始化
1：服务器连接已建立
2：请求接收
3：请求处理中
4：请求已经完成，且响应已就绪
4.3.2 status：监听Http Status状态码
例：200，服务器没有问题，数据完美返回
404，找不到访问的资源
500，服务器后台代码有问题

4.5 XMLHttpRequest 事件属性
4.5.1 onreadystatechange 写法
第一种写法：类似JS中事件绑定去实现Ajax回调函数。

第二种写法：专门对回调函数进行定义。

第三种写法：如果当前操作（当前网页中有多个Ajax的调用）有多个Ajax的实现。

4.6 XMLHttpRequest open()方法
4.6.1 open(method,url,async):打开一个Ajax请求
method：POST和GET
url：远程服务器的地址
async：设置Ajax请求处理方式是同步（false）还是异步（true）
4.7 XMLHttpRequest send()方法
send(String)：发送数据，要求必须POST方式
4.8 XMLHttpRequest 添加协议头
setRequestHeader(Header,Value):添加协议头信息
5.数据解析
Ajax应用中数据解析是非常重要的一件事。一般返回服务器有三种格式：txt，xml，json。
5.1 解析txt
5.1.1当服务器端返回数据为字符串，则这种Ajax数据格式就是txt。
5.1.2 在浏览器端我们通过responseText来获得字符串形式的响应数据。
5.2 解析XML
5.2.1当服务器返回数据为XML，则这种Ajax数据格式就是XML。
5.2.2 在浏览器端我们通过responseXML来获得XML形式的响应数据。
5.2.3XML 节点遍历
a.XML中的数据类似是DOM节点。
b.XML遍历操作的方法。

5.3 解析JSON
5.3.1 JSON是什么
a.JSON（JavaScript object notation）是一种轻量级的数据交换格式。易于阅读和编写。
b.JSON采用完全独立于语言的文本格式，但是也使用了类似于C语言家族的习惯（包括，C,C++,C#,java，JavaScript，Perl，Python等）这些特性使JSON成为理想的数据交换语言。
c.JSON比XML更小、更快，更易解析，服务器端生成JSON数据更简单
5.3.2 JSON数据结构。
a.“名称/值”对的集合（A collection of name/value pairs）它被理解为对象（object）。
b.值的有序列表（An ordered list of values）。在大部分语言中，它被理解为数组（array）。

5.3.3 JSON数据格式图谱





5.3.4 JSON 数据解析
在数据传输流程中，json是以文本，即字符串的形式传递的，而JS操作的是JSON对象，所以，JSON对象和JSON字符串之间的相互转换是关键。
5.3.4.1 JSON字符串
JSON字符串：var str1 =’{“name”:”ljx”,”sex”:”man”}’;
5.3.4.2 JSON对象
JSON对象：var str2 = {“name”:”ljx”,”sex”:”man”};
5.3.4.3 JSON字符串转JSON对象
第一种方式：eval函数完成JSON字符串转JSON对象。该方法为原生JS语法。
第二种方式：使用JSON提供了json.js包，然后将json2.js放入到网页中。
第三种方式：使用jQuery完成格式的转换。
5.3.4.4 JSON对象转JSON字符串
使用json2.js中的stringify()完成JSON对象转JSON字符串。
5.3.4.5 JSON数组对象解析
第一种数组格式的JSON数据解析。因为JSON使用JavaScript语法，所以通过JavaScript，可以创建一个对象数组。
第二种JSON数组格式解析。
6. 服务器端发送JSON数据
6.1 GSON开源jar包
GSON是Google开发的Java API，用于转换Java对象和Json数据
6.1.1 JavaBean转JSON
6.1.2 集合转JSON
6.1.3 JSON反序列化
Json序列化：将服务器端的javaBean对象转换成JSON字符串
Json反序列化：服务器端得到一个JSON字符串，然后将JSON字符串转换JavaBean对象
6.1.3.1 反序列化的作用