原生js与jq对ajax的实现
以下是个人笔记：
原生的js通过get与post对ajax进行实现
利用js 来无刷新的与后台进行数据交互，通过get或post将数据传到后台，然后根据反回的数据进行DOM 节点操作。（对前台页面（数据）进行修改）
GET：
var
xmlhttp =
new
XMLHttpRequest();xmlhttp.open(
"GET"
,
"demo_get.php?id=1&name=lemoo&t="
+
Math
.random(),
true
);xmlhttp.send();
POST：
var
xmlhttp =
new
XMLHttpRequest();xmlhttp.open(
"POST"
,
"ajax_test.php"
,
true
);//什么方式，地址xmlhttp.setRequestHeader(
"Content-type"
,
"application/x-www-form-urlencoded"
);xmlhttp.send(
"fname=Bill&lname=Gates"
);//要发送给后台的数据xmlhttp.onreadystatechange=
function
() {// 根据进行状态对返回的数据进行处理
if
(xmlhttp.readyState==
4
&& xmlhttp.status==
200
) {
document
.getElementById(
"myDiv"
).innerHTML=xmlhttp.responseText;//xmlhttp.responseText为返回的数据 } }
JQ实现：
同样也有get post方法
get：
$.get(url,[callback])// 第一个参数为地址后便可以附加要传给后台的数据，第二个参数为对返回数据进行处理的函数。
post：（一般post传输数据多，大）
$.post(url,[data],[callback])// 第一个参数为地址，第二个参数为要传给后台的数据，第三个参数为对返回数据进行处理的函数。
ajax：
$.ajax({ type:
"post"
, url:
"demo_test.php"
, //传输地址：当后台为java是可以写为 user.add这种地址 这既可以写绝对地址也可以写相对地址 没影响 data: { num:
123
},//要传输的数据 dataType:
"text"
,//传输类型 success:
function
(data) {//当传输成功时，data 为接收的数据 对接受的数据进行处理。 alert(
1
);
也可以在这里边调用其它函数，将数据传过去进行处理 }});
successfunction(){}:（PHP可以在内部写html，在后台写完页面后直接返回前台，然后append进页面，而Java则需要在前台写html）
JSONP：
(用这种方式传输需要在链接后边加上callback=)
当传输类型为jsonp时，可以实现跨域访问。
创建一个回调函数，然后在远程服务上调用这个函数并且将JSON 数据形式作为参数传递，完成回调
。
将JSON数据填充进回调函数
，这就是JSONP的JSON+Padding的含义吧。
实例：
1
<
script
type
="text/javascript">
2
//回调函数
3
function
callback(data) {//这个返回函数的名字可以在给远程服务器传输数据时自己命名
4
alert(data.message);
5
}
6
script
>
7
<
script
type
="text/javascript"
src
="
http://ajax.googleapis.com/ajax/services/search/web?v=1.0&q=?&callback=?
（可以自己命名）
">
script
>// 这访问的是谷歌的ajax接口。
q=?这个问号是表示你要搜索的内容，最重要的是第二个callback=?这个是正如其名表示回调函数的名称，也就是将你自己在客户端定义的回调函数的函数名传送给服务端，服务端则会返回以你定义的回调函数名的方法，将获取的json数据传入这个方法完成回调。
jq方式的jsonp：
<
script
type
="text/javascript">
$.ajax({
url:"http://localhost:20002/MyService.ashx?callback=?",
dataType:"jsonp",
jsonpCallback:"person",//给返回的函数命名
success:
function
(data){
alert(data.name +
" is a a"
+ data.sex);
}
});
function person(data){
alert(data.nam);
}
script
>
下边这个是单纯的对数据进行处理，且返回的是json数组格式。
在url的后面必须添加一个callback参数，这样getJSON方法才会知道是用JSONP方式去访问服务
<
script
type
="text/javascript">
$.getJSON("http://localhost:20002/MyService.ashx?callback=?",
function
(data){
alert(data.name +
" is a a"
+ data.sex);
});
script
>
json与jsonp的区别、同源策略：
http://blog.csdn.net/jing_valora/article/details/51915573
readyState与status状态的含义
1.Ajax：readyState（状态值）和status（状态码）的区别
readyState，是指运行AJAX所经历过的几种状态，无论访问是否成功都将响应的步骤，可以理解成为AJAX运行步骤，使用“ajax.readyState”获得
status，是指无论AJAX访问是否成功，由HTTP协议根据所提交的信息，服务器所返回的HTTP头信息代码，使用“ajax.status”获得
总体理解：可以简单的理解为state代表一个整体的状态。而status是这个大的state下面具体的小的状态。
2.什么是readyState
readyState是XMLHttpRequest对象的一个属性，用来标识当前XMLHttpRequest对象处于什么状态。
readyState总共有5个状态值，分别为0~4，每个值代表了不同的含义
0：初始化，XMLHttpRequest对象还没有完成初始化
1：载入，XMLHttpRequest对象开始发送请求
2：载入完成，XMLHttpRequest对象的请求发送完成
3：解析，XMLHttpRequest对象开始读取服务器的响应
4：完成，XMLHttpRequest对象读取服务器响应结束
3.什么是status
status是XMLHttpRequest对象的一个属性，表示响应的HTTP状态码
在HTTP1.1协议下，HTTP状态码总共可分为5大类
1xx：信息响应类，表示接收到请求并且继续处理
2xx：处理成功响应类，表示动作被成功接收、理解和接受
3xx：重定向响应类，为了完成指定的动作，必须接受进一步处理
4xx：客户端错误，客户请求包含语法错误或者是不能正确执行
5xx：服务端错误，服务器不能正确执行一个正确的请求