ajax异步技术和json

Ajax

1. ajax的特点
   实现网页的局部刷新

2. ajax的基本原理
   Ajax的工作原理相当于在用户和服务器之间加了—个中间层(AJAX引擎),使用户操作与服务器响应异步化。并不是所有的用户请求都提交给服务器,像—些数据验证和数据处理等都交给Ajax引擎自己来做, 只有确定需要从服务器读取新数据时再由Ajax引擎代为向服务器提交请求
   

3. 创建ajax请求示例

//声明单击事件--ajax
     		function testAjax(){
     			//创建Ajax引擎对象
	     			var ajax;
	     			if(window.XMLHttpRequest){//火狐
	     				ajax=new XMLHttpRequest();
	     			}else if(window.ActiveXObject){//ie
	     				ajax=new ActiveXObject("Msxml2.XMLHTTP");
	     			}
	     		//声明事件监听
	     			ajax.onreadystatechange=function(){
	     				//判断ajax的状态码
	     				if(ajax.readyState==4){
	     					//判断响应状态码
	     					if(ajax.status==200){
	     						//处理响应
			     					//获取响应内容
			     						var data=ajax.responseText;
	     							//使用eval方法将字符串数据转换为js对象
	     								eval("var obj="+data);//eval("var obj={uid:18,uname:'王五',age:18,fav:'看电影'}")
			     					//获取div对象
			     						var div=document.getElementById("showdiv");
			     						div.innerHTML=obj.fav;
	     					}else if(ajax.status==404){
	     						//获取div对象
	     						var div=document.getElementById("showdiv");
	     						div.innerHTML="请求资源不存在";
	     					}else if(ajax.status==500){
	     						//获取div对象
	     						var div=document.getElementById("showdiv");
	     						div.innerHTML="内部服务器繁忙";
	     					}else{
	     						//获取div对象
	     						var div=document.getElementById("showdiv");
	     						div.innerHTML="未知异常";
	     					}
	     				}
	     			}
	     		//发送请求
	     			//get请求方式
		     			/* //创建请求
		     				ajax.open("get","my?uname=张三&pwd=123",false);
		     			//发送请求
		     				ajax.send(null); */
		     		//post请求方式
		     			//创建请求
		     			ajax.open("post","my",false);
		     			//设置请求参数为键值对方式
		     			ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
		     			//发送请求
		     			ajax.send("uname=张三&pwd=123");
	     		//异步同步
	     			var div=document.getElementById("showdiv");
	     			alert(div.innerHTML);
     		}

4. ajax的状态码
   (1) 视频中讲解的Ajax的状态码及其含义是?
   0:表示ajax请求对象创建
   1：表示请求对象创建但未发送ajax.open(“get”,”my”)
   2：请求发送ajax.send();
   3:请求处理完毕，正在接收响应数据
   4：响应内容接受完毕
   （2）Ajax的响应状态码：
   200：成功
   404：资源未找到
   500：服务器内部错误

5. ajax异步和同步
   异步false：当前js函数会继续执行，无需等待ajax请求的响应以及响应的处理
   同步true：当前js函数等待ajax函数的执行结果，ajax响应结束后继续执行函数，默认同步

6. ajax异步同步总结和ajax的get请求和ajax的post请求
   (1) 创建ajax.open的总结内容
   Ajax.open(method,url,ansyc);
   Method:表示请求方式
   url：表示请求路径
   ansyc：设置同步或异步请求，默认异步
   (2) ajax的get请求如何附带请求数据。
   请求数据以？的方式拼接在url后面，不能在send中添加请求数据
   (3) ajax的post请求如何附带请求数据。
   需要进行单独的请求数据的设置：ajax.setRequestHeader(“ContentType”,”application/x-www-form-urlencoded”);
   设置请求的数据格式为键值对数据例如：
   Ajax.send(“name=zhangsan&psw=1234”);

7. ajax响应数据问题

i.	创建ajax引擎函数
ii.	声明监听函数
判断ajax状态码
	判断响应状态码
		获取响应信息
		处理响应
iii.	创建并发送ajax请求
创建请求(设置请求方式，设置请求地址，设置同步或者异步)
iv.	其他处理

json

1. 什么是json
   json，是一种数据格式，在与后端的数据交互中有较为广泛的应用

2. json数据的格式
   {“key”:”value”}

3. json的作用是什么
   保证对象数据的紧密性和完整性

4. 使用josn格式完成数据响应
   (1) 在后台手动拼接的User对象的json字符串
   {uid:18,uname:”王五”，age:18，fav:“看电影“}
   (2) eval方法的作用
   将json格式数据转换成js对象
   (3) 使用eval方法将json字符串转换对js对象的代码
   eval(“var d=”+data);
   (4) gson包的作用，使用哪个方法可以将Java对象转换为对应的json字符串
   进行json格式字符串的拼接
   String str=new Gson().toJson(user);