jQuery AJAX方法
一:$.get() 方法
1:介绍:$.get方法基于HTTP发送GET请求
2:用法:
$.get("index.php",{id:5,page:1},function(data,status){ alert(data);//返回数据 },"json"); //json格式index.php:请求地址
id和page:GET请求参数,以 Key/value 的键值对形式表示
status:请求状态("success"、"notmodified"、"error"、"timeout"、"parsererror"),运行成功时,才能获取此状态,一般省略
响应数据类型这里为:json,也可以省略,默认字符串类型
二:$.post() 方法
1:介绍:$.post方法基于HTTP发送POST请求
2:用法:方法同上
$.post("index.php",{id:5,page:1},function(data,status){ alert(data);//返回数据 },"json"); //json格式
RESTFul 的PUT/PATCH/DELETE其实都是post请求,也可以通过POST带_method参数,比如DELETE提交:
$.post("index.php",{'_method':'DELETE',id:5,page:1},function(data,status){ alert(data);//返回数据 },"json"); //json格式
三:$.getJSON()
1:介绍:使用 AJAX 的 HTTP GET 请求获取 JSON 数据。
2:用法:和$.get方法类似,但不用指定json类型
$.getJSON("index.php",{id:5,page:1},function(data,status){ alert(data);//返回json数据 });
四:$.ajax() 方法
1:介绍:$.ajax()方法基于HTTP发送POST或者GET请求,也可以模拟REST请求规则,更底层的ajax()函数,能够实现更复杂的设计。
2:用法:
$.ajax({ url: '1.php', data:{id:5,page:1}, //发送数据 可选 type: 'POST', //方式 dataType: 'json', // 可选 timeout: 1000, //设置请求超时时间(毫秒)可选 error: function(){ alert('加载文档时出错'); }, success: function(data){ alert(data); }, });
$.ajax()不仅能实现$.get,$.post,还可以设定beforeSend()、error()、success()以及complete()回调函数
更复杂的用法:
$.ajax({ url: '1.php', data:{id:5,page:1}, //发送数据 可选 type: 'POST', //方式 dataType: 'json', // 可选 timeout: 1000, //设置请求超时时间(毫秒)可选 error: function(){ alert('加载文档时出错'); }, success: function(data){ //alert(data); }, //发送请求前调用,这里加入"正在加载" beforeSend:function(XMLHttpRequest){ $("#doing").html("正在加载中,请稍后···"); }, //请求完成时运行的函数(在请求成功或失败之后均调用,即在 success 和 error 函数之后)。 complete:function(XMLHttpRequest,textStatus){ $("#doing").empty(); }, });
getJSON和ajax方法可以实现跨域操作
五:json操作
1:直接解析
{"name":1,"sex":2,"aub":"china"}
$.post("index.php",{id:5},function(data,status){ alert(data.name); alert(data.sex); alert(data.aub); //一维数组直接写 },"json"); //这里已经转化为json对象,所以可以直接获取
多维数组遍历即可
$.get("1.php",{id:5},function(data,status){ for(var i = 0; i < data.length; i++) { alert(data[i].name); } },"json"); //这里已经转化为json对象,所以可以直接获取
3:$.each方法
$.each非常强大,可以遍历json、对象、数组、DOM等
$.get("1.php",{id:5},function(data,status){ $.each(data, function(commentIndex, comment){ alert(comment['name']); }); },'json');
4:object对象转换为json字符串
var json= JSON.stringify(data)
5:$.parseJSON
JSON字符串转为与之对应的JavaScript对象