标签：
1.什么是ajax? (asynchronous javascript and xml)
是一种用来改善用户体验的技术,其实质是利用浏览器提供的一个特殊对象(XMLHttpRequest)异步地向服务器发送请求，
服务器返回部分数据，浏览器利用这些数据对当前页面做局部更新，整个过程，页面无刷新，不打断用户的操作。
注：
异步: 当ajax对象(XMLHttpRequest)向服务器发送请求的时候，浏览器不会销毁当前页面，用户仍然可以对当前页面做其它操作。
使用BS结构时：
使用AJAX工作原理：
2.ajax对象
(1)如何获得该对象?
function getXhr(){
var xhr = null;
if(window.XMLHttpRequest){
xhr = new XMLHttpRequest();
}else{
xhr = new ActiveXObject(‘microsoft.XMLHttp‘);
}
return xhr;
}
(2)几个重要属性
1)onreadystatechange:绑订事件处理函数，用来处理readystatechange事件。
注：
当ajax对象的readystate属性值发生了改变，比如从0变成了1，就会产生该事件。
2)readyState:有五个值，分别是0,1,2,3,4,表示ajax对象通信的状态，其中，4表示ajax对象已经获得了服务器返回的所有的数据。
3)responseText:获得服务器返回文本数据。
4)responseXML:获得服务器返回的xml文档。
5)status:获得状态码。
3.编程步骤
step1,获得ajax对象
比如: var xhr = getXhr();
step2,发送请求
1)get请求
xhr.open(‘get‘,‘check_uname.do?username=Tom‘,true);
xhr.onreadystatechange=f1;
xhr.send(null);
注
true:异步地(当ajax对象(XMLHttpRequest)向服务器发送请求的时候，浏览器不会销毁当前页面，用户仍然可以对当前页面做其它操作)。
false:同步地(当ajax对象(XMLHttpRequest)向服务器发送请求的时候，浏览器不会销毁当前页面,浏览器会锁定当前页面，用户不
能够对当前页面做其它操作)。
2)post请求
xhr.open(‘post‘,‘check_uname.do‘,true);
xhr.setRequestHeader(‘content-type‘,‘application/x-www-form-urlencoded‘);
xhr.onreadystatechange=f1;
xhr.send(‘username=Tom‘);
注：
ajax对象在发送post请求时，默认不会添加"content-type"消息头，所以，需要调用setRequestHeader方法来手动添加。
step3,编写服务器端的处理程序。一般来说，服务器端不需要返回完整的页面，只需要返回部分的数据。
step4,事件处理函数
function f1(){
//获得服务器返回的部分数据
if(xhr.readyState == 4 && xhr.status == 200){
var txt = xhr.responseText;
//更新页面
...
}
}
4.缓存问题
(1)什么是缓存问题?
ie浏览器在发送get请求时，会比较请求地址是否访问过，如果访问过，则不再发送新的请求，而是显示之前的访问的结果。
(2)解决方式
在请求地址后面添加上一个随机数。
xhr.open(‘get‘,‘shownumber.do?‘+Math.random(),true);
5.编码问题
(1)get请求
1)为什么会产生乱码?
对于中文参数值，ie浏览器会使用"gbk"来编码,其它浏览器会使用"utf-8"来编码。服务器端默认会使用"iso-8859-1"来解码。
2)如何解决?
step1,服务器端统一使用"utf-8"来解码。
修改tomcat的server.xml文件<Connector URIEncoding="utf-8"/>
注：只针对get请求有效。
step2,使用encodeURI函数对请求参数进行编码。
注：encodeURI是一个内置的函数，会使用utf-8来编码。
var uri = ‘check.do?username=‘+$F(‘username‘);
xhr.open(‘get‘,encodeURI(uri),true);
(2)post请求
1)为什么会产生乱码?
浏览器会使用"utf-8"来编码。而服务器默认使用"iso-8859-1"来解码。
2)如何解决?
request.setCharacterEncoding("utf-8");
6.json(javascript object notation)
www.json.org
(1)json是什么?
轻量级的数据交换格式
1)数据交换
将要交换的数据转换成一种与平台无关的数据格式(比如xml)，然后交给接收方来处理。
2)轻量级
相对于xml,json文档要更小，解析速度要更快。
(2)基本语法
1)表示一个对象
{属性名:属性值,属性名:属性值...}
var obj = {"name":"明楼","age":33};
注：
a.属性名必须使用双引号括起来。
b.属性值可以是string,number,true/false,null,object。
c.属性值如果是string,必须使用双引号括起来。
2)表示由多个对象组成的数组
[{},{},{}....]
var arr = [{"name":"明楼","age":23},{"name":"明台","age":33}];
(3)如何使用json?
1)将java对象(或者java对象组成的数组或者集合)转换成json字符串的形式。
使用json提供的jar包JSONObject,JSONArray
java对象：
JSONObject obj = JSONObject.fromObject(s);
String jsonStr = obj.toString();
java对象组成的数组或集合：
JSONArray obj = JSONArray.fromObject(stocks);
String jsonStr = obj.toString();
2)将json字符串转换成javascript对象(或者javascript对象组成的数组)。
prototype.js提供的evalJSON()函数。
$(id): 依据id查找节点。
$F(id): 依据id查找节点,返回value。
strip():除掉字符串两端的空格。
evalJSON():将json字符串转换成javascript对象或者javascript对象组成的数组。
json字符串转换成javascript对象:
var str = ‘{"code":"600015","name":"山东高速","price":10}‘;
var obj = str.evalJSON();
java字符串转换成javascript对象组成的数组：
var str = ‘[{"name":"明楼","age":23},{"name":"明台","age":33}]‘;
var arr = str.evalJSON();
标签：
原文地址：http://www.cnblogs.com/gaochaojin/p/4822678.html
