请关注“知了堂学习社区”,地址:http://www.zhiliaotang.com/portal.php
1.Ajax作用
- ajax是什么
- 传统web应用采用同步交互方式实现数据呈现,当服务器处理请求时,客户端必须要等待
- ajax建立起了浏览器客户端与服务器之间的桥梁,可以消除网络交互过程中对的处理-等待-处理的缺陷
- ajax全称:Asynchronous JavaScript and XML 异步JavaScript和XML
- Ajax异步交互
- 浏览器发送请求到达服务器端
- 服务器端通过后台业务框架进行数据处理
- 服务器处理好的数据会转成XML,JSON,Text,同时将数据发送到客户端
- 客户端通过XMLHttpRequest核心对象对数据进行解析
- 最后将解析好的数据通过HTML,css等技术进行装饰
- XML
- XML就是一个数据结构,数据模型,且是有关联的数据模型
- WebService应用,就是以XML数据进行数据之间的传递和交互
2.XMLHTTPRequest 对象
- XMLHttpRequest 创建
var xmlHttpReq = false;
function createXmlHttpRequest(){
if(windown.XMLHttpRequest){
xmlHttpReq = new XMLHttpRequest();
}else if(windown.ActiveXObject){
try{
xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
}catch(e){
console.log("===fail=====");
}
}
- XMLHttpRequest的属性和方法
- 响应属性
- responseXML:接收服务器响应XMl格式数据
- ReponseText:接收服务器响应文本字符串数据
- 状态属性
- readyState:监控服务器响应变化状态。状态变化是有数字0~4构成
- status:监听Http Status 状态码
- 200,服务器没有问题,数据也是完好返回
- 500,服务器后台代码有问题
- 404,找不到访问的资源
- 事件属性
- onreadystatechange:创建回调函数,然后接收服务器返回的状态与数据
- 响应属性
- XMLHttpReqeust open()方法
- open(method,url,async):打开一个ajax请求
- method:POST和GET
- url:远程服务器的地址
- async:设置ajax请求方式是同步(false)还是异步(true)
- XMLHttpReqeust send()方法
- send(String):发送数据,要求必须POST方法
- XMLHttpReqeust 添加协议头
- setRequestHeader(Header,Value)添加协议头信息
3.XML/JSON解析
- 解析txt
- 当服务器端返回数据为字符串时,ajax数据格式就是TXT
- 在浏览器端通过ResponseText来获得字符串形式的响应数据
- 解析XML
- 当服务器端返回数据为XML时,ajax数据格式就是XML
- 在浏览器端通过ResponseXML来获得字符串形式的响应数据
解析JSON
- 什么是JSON
- JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,易于阅读和编写
- JSON采用完全独立于语言的文本格式,也使用了类似于C语言家族的习惯(包括c,c++,c#,java,JavaScript,Perl,Python等)。这些特性是JSON成为理想的数据交换格式
- JSON比XMl更小更快更易解析,服务器端生成JSON数据更加的简单。
JSON的数据结构
- “名称/值”对的集合,它被理解为对象(object)
var o = {“nis”:”snid”,”ssd”:”sdad”} - 值得有序列表,在大部分语言中,被称为数组
var arr = [{“nis”:”snid”,”ssd”:”sdad”},{“nis”:”snid”,”ssd”:”sdad”}]
- “名称/值”对的集合,它被理解为对象(object)
JSON数据解析
- 在数据传输流程中,json是以文本,即字符串的形式传递的,而js操作的是JSON对象,所以JSON对象和JSON字符串之间的相互转换是关键
- JSON字符串:var str1 = ’ {“nis”:”snid”,”ssd”:”sdad”}’;
- JSON对象:var str2 = {“nis”:”snid”,”ssd”:”sdad”};
- JSON字符串转JSON对象
- eval函数完成JSON字符串转JSON对象,原生JS语法
- 使用JSON提供的json.js包,将其放入网页中 parse
- 使用jQuery完成格式的转化 parseJSON
- JSON对象转JSON字符串
- 使用json2.js中stringify()完成
- JSON反序列化
JSON反序列化:服务器端得到一个JSON字符串,然后将JSON字符串转换成JavaBean对象
- 全局角度考虑(MVC开发流程),客户提交一个数据,控制层的得到数据,如果数据直接转换JavaBean对象,在业务层和数据访问层在操作上会变得简单
- 到了框架的阶段,则直接javabean来完成insert操作
- 什么是JSON