ajax 对 Json 格式的解析
来源:互联网 发布:淘宝好吃的泡面排行榜 编辑:程序博客网 时间:2024/06/05 03:33
Json 的介绍:
JSON 可以将 JavaScript 对象中表示的一组数据转换为字符串,然后就可以在函数之间轻松地传递这个字符串,或者在异步应用程序中将字符串从 Web 客户机传递给服务器端程序。
按照最简单的形式,可以用下面这样的 JSON 表示名称/值对:
{ “firstName”: “Brett” }
这样的键/值对也可以是多个:
{“name”:”aaa”,”sex”:”男”,”age”:”20”}
从语法方面来看,这与名称/值对相比并没有很大的优势,但是在这种情况下 JSON 更容易使用,而且可读性更好。
值的数组
当需要表示一组值时,JSON 不但能够提高可读性,而且可以减少复杂性。
如果使用 JSON,就只需将多个带花括号的记录分组在一起:
{ “people”: [
{ “firstName”: “Brett”, “lastName”:”McLaughlin”, “email”: “111111” },
{ “firstName”: “Jason”, “lastName”:”Hunter”, “email”: “22222” },
{ “firstName”: “Elliotte”, “lastName”:”Harold”, “email”: “33333” }
]}
可以使用相同的语法表示多个值(每个值包含多个记录):
{ “programmers”: [
{ “firstName”: “Brett”, “lastName”:”McLaughlin”, “email”: “3333” },
{ “firstName”: “Jason”, “lastName”:”Hunter”, “email”: “1222” },
{ “firstName”: “Elliotte”, “lastName”:”Harold”, “email”: “3333” }
],
“authors”: [
{ “firstName”: “Isaac”, “lastName”: “Asimov”, “genre”: “science fiction” },
{ “firstName”: “Tad”, “lastName”: “Williams”, “genre”: “fantasy” },
{ “firstName”: “Frank”, “lastName”: “Peretti”, “genre”: “christian fiction” }
],
“musicians”: [
{ “firstName”: “Eric”, “lastName”: “Clapton”, “instrument”: “guitar” },
{ “firstName”: “Sergei”, “lastName”: “Rachmaninoff”, “instrument”: “piano” }
]
}
Json也可以这样写:
{ "listaccountsresponse" : { "count":1 ,"account" : [ {"id":5,"name":"xian1","accounttype":0,"domainid"
:2,"domain":"Server","receivedbytes":649444,"sentbytes":175467975,"vmlimit":"20","vmtotal":2,"vmavailable"
:"18","iplimit":"20","iptotal":1,"ipavailable":"19","volumelimit":"20","volumetotal":2,"volumeavailable"
:"18","snapshotlimit":"20","snapshottotal":0,"snapshotavailable":"20","templatelimit":"20","templatetotal"
:0,"templateavailable":"20","vmstopped":0,"vmrunning":2,"state":"enabled","user":[{"id":5,"username"
:"xian1","firstname":"Eric","lastname":"Tang","email":"Wang-Ngai.Tang@pccw.com","created":"2012-03-22T09
:36:44+0800","state":"enabled","account":"xian1","accounttype":0,"domainid":2,"domain":"Server","timezone"
:"Asia/Shanghai"}]} ] } }
ajax对Json格式数据的解析 :
1.对简单json格式的解析:
{ “firstName”: “Brett” }
url:”这里是你要请求的地址”,
data:{“id”:id}, //以键/值对的形式
async : false,
dataType : “json”,
success : function(data) {
alert(“firstName = ” + data.firstName);
}
});
注:这里的data是你从后台穿过来的Json字符传串。
后台写法:
- response.setCharacterEncoding(”utf-8”);
- response.setContentType(”text/json;charset=UTF-8”);
- PrintWriter out = null;
- String count = ”<span style=”color: #000000;“>{ ”firstName“: ”Brett” }</span>
- ;
- try {
- out = response.getWriter();
- } catch (Exception e) {
- e.printStackTrace();
- }
- out.print(count);
- out.flush();
这样就能在前台页面弹出提示框:firstName = Brett。
2.多个键/值对和上面的情况一样
3.解析Json如下数组:
{
{ “firstName”: “Brett”, “lastName”:”McLaughlin”, “email”: “111111” },
{ “firstName”: “Jason”, “lastName”:”Hunter”, “email”: “22222” },
{ “firstName”: “Elliotte”, “lastName”:”Harold”, “email”: “33333” }
}
- $.ajax({
- url:”这里是你要请求的地址”,
- data:{”id”:id}, //以键/值对的形式
- async : false,
- dataType : ”json”,
- success : function(data) {
- for(int i = 0; i < data.length; i++) { //循环后台传过来的Json数组
- var datas = data[i];
- alert(datas.firstName);
- alert(datas.lastName);
- alert(datas.email);
- }
- }
- });
4.解析如下Json数据
{ “programmers”: [
{ “firstName”: “Brett”, “lastName”:”McLaughlin”, “email”: “3333” },
{ “firstName”: “Jason”, “lastName”:”Hunter”, “email”: “1222” },
{ “firstName”: “Elliotte”, “lastName”:”Harold”, “email”: “3333” }
],
“authors”: [
{ “firstName”: “Isaac”, “lastName”: “Asimov”, “genre”: “science fiction” },
{ “firstName”: “Tad”, “lastName”: “Williams”, “genre”: “fantasy” },
{ “firstName”: “Frank”, “lastName”: “Peretti”, “genre”: “christian fiction” }
],
“musicians”: [
{ “firstName”: “Eric”, “lastName”: “Clapton”, “instrument”: “guitar” },
{ “firstName”: “Sergei”, “lastName”: “Rachmaninoff”, “instrument”: “piano” }
]
}
- $.ajax({
- url:”这里是你要请求的地址”,
- data:{”id”:id}, //以键/值对的形式
- async : false,
- dataType : ”json”,
- success : function(data) {
- var pro = data.programmers; // pro为programmers的一个数组
- for(int i = 0; i < pro.length; i++) { //循环后台传过来的Json数组
- var datas = pro[i];
- alert(pro.firstName);
- alert(pro.lastName);
- alert(pro.email);
- }
- var aut = data.authors; // aut为authors的一个数组
- for(int i = 0; i < aut.length; i++) { //循环后台传过来的Json数组
- var datas = aut[i];
- alert(aut.firstName);
- alert(aut.lastName);
- alert(aut.genre);
- }
- var mus = data.musicians; // aut为authors的一个数组
- for(int i = 0; i < mus.length; i++) { //循环后台传过来的Json数组
- var datas = mus[i];
- alert(mus.firstName);
- alert(mus.lastName);
- alert(mus.instrument);
- }
- }
- });
5.
{ "listaccountsresponse" : { "count":1 ,"account" : [ {"id":5,"name":"xian1","accounttype":0,"domainid"
:2,"domain":"Server","receivedbytes":649444,"sentbytes":175467975,"vmlimit":"20","vmtotal":2,"vmavailable"
:"18","iplimit":"20","iptotal":1,"ipavailable":"19","volumelimit":"20","volumetotal":2,"volumeavailable"
:"18","snapshotlimit":"20","snapshottotal":0,"snapshotavailable":"20","templatelimit":"20","templatetotal"
:0,"templateavailable":"20","vmstopped":0,"vmrunning":2,"state":"enabled","user":[{"id":5,"username"
:"xian1","firstname":"Eric","lastname":"Tang","email":"Wang-Ngai.Tang@pccw.com","created":"2012-03-22T09
:36:44+0800","state":"enabled","account":"xian1","accounttype":0,"domainid":2,"domain":"Server","timezone"
:"Asia/Shanghai"}]} ] } }
- $.ajax({
- url:”这里是你要请求的地址”,
- data:{”id”:id}, //以键/值对的形式
- async : false,
- dataType : ”json”,
- success : function(data) {
- var accounts = data.listaccountsresponse.account; //取到“account”中的数据
- for(int i = 0; i < accounts.length; i++) { //循环后台传过来的Json数组
- var datas = accounts[i];
- alert(datas.id);
- alert(datas.name);
- alert(datas.accounttype);
- ……….
- }
- }
- });
—–这里是自己写的一个后台传值———————————————————————————————————-
- @RequestMapping(value=”/applyVm/listApplyVmCount”, method={RequestMethod.GET, RequestMethod.POST})
- public void listApplyVmCount(HttpServletRequest request, HttpServletResponse response) {
- response.setCharacterEncoding(”utf-8”);
- response.setContentType(”text/json;charset=UTF-8”);
- PrintWriter out = null;
- String count = ”“;
- try {
- out = response.getWriter();
- Map<String, Integer> map = applyVmService.findApplyVmCount();
- Gson gson = new Gson();
- count = gson.toJson(map);
- } catch (Exception e) {
- e.printStackTrace();
- }
- out.print(count);
- out.flush();
- }
<div id="digg" articleid="50504279"> <dl id="btnDigg" class="digg digg_enable" onclick="btndigga();"> <dt>顶</dt> <dd>0</dd> </dl> <dl id="btnBury" class="digg digg_enable" onclick="btnburya();"> <dt>踩</dt> <dd>0</dd> </dl> </div> <div class="tracking-ad" data-mod="popu_222"><a href="javascript:void(0);" target="_blank"> </a> </div><div class="tracking-ad" data-mod="popu_223"> <a href="javascript:void(0);" target="_blank"> </a></div><script type="text/javascript"> function btndigga() { $(".tracking-ad[data-mod='popu_222'] a").click(); } function btnburya() { $(".tracking-ad[data-mod='popu_223'] a").click(); } </script>
- 上一篇深入浅出Mybatis系列(九)-强大的动态SQL
- 下一篇Jquery ajax方法解析返回的json数据
<div style="clear:both; height:10px;"></div> <div class="similar_article"> <h4></h4> <div class="similar_c" style="margin:20px 0px 0px 0px"> <div class="similar_c_t"> 相关文章推荐 </div> <div class="similar_wrap tracking-ad" data-mod="popu_36" style="max-height:195px;"> <ul class="similar_list fl"> <li> <em>•</em> <a href="http://blog.csdn.net/hulefei29/article/details/3345053" title="Ajax中XML和JSON格式的优劣比较" strategy="" target="_blank" style="width: 290px;">Ajax中XML和JSON格式的优劣比较</a> </li> <li> <em>•</em> <a href="http://dreams75.iteye.com/blog/512554" title="原生AJAX或jQuery实现二级联动选择以及解析XML和JSON数据格式" strategy="" target="_blank" style="width: 290px;">原生AJAX或jQuery实现二级联动选择以及解析XML和JSON数据格式</a> </li> <li> <em>•</em> <a href="http://blog.csdn.net/dainiao01/article/details/2471965" title="基于JSON格式报文的AJAX通用实现" strategy="" target="_blank" style="width: 290px;">基于JSON格式报文的AJAX通用实现</a> </li> <li> <em>•</em> <a href="http://blog.csdn.net/wk206612776/article/details/36503367" title="js/jquery解析json和数组格式的方法介绍" strategy="" target="_blank" style="width: 290px;">js/jquery解析json和数组格式的方法介绍</a> </li> <li> <em>•</em> <a href="http://baihe747.iteye.com/blog/2167169" title="js解析文本数据 xml格式数据,json数据和ajax和servlet交互乱码解决" strategy="" target="_blank" style="width: 290px;">js解析文本数据 xml格式数据,json数据和ajax和servlet交互乱码解决</a> </li> </ul> <ul class="similar_list fr"> <li> <em>•</em> <a href="http://film.iteye.com/blog/254911" title="extjs ajax方式前后台数据传送(json格式)" strategy="" target="_blank" style="width: 290px;">extjs ajax方式前后台数据传送(json格式)</a> </li> <li> <em>•</em> <a href="http://blog.csdn.net/liujiahan629629/article/details/17332297" title="AJAX——JSON数据格式" strategy="" target="_blank" style="width: 290px;">AJAX——JSON数据格式</a> </li> <li> <em>•</em> <a href="http://barabbas.iteye.com/blog/1773564" title="JSON格式解析 ." strategy="" target="_blank" style="width: 290px;">JSON格式解析 .</a> </li> <li> <em>•</em> <a href="http://blog.csdn.net/caozhi01/article/details/3414196" title="ajax打印对象时,转换由java对象转为Json格式的String时遇到的Hibernate问题" strategy="" target="_blank" style="width: 290px;">ajax打印对象时,转换由java对象转为Json格式的String时遇到的Hibernate问题</a> </li> <li> <em>•</em> <a href="http://yang7527.iteye.com/blog/768401" title="extjs ajax方式前后台数据传送(json格式 " strategy="" target="_blank" style="width: 290px;">extjs ajax方式前后台数据传送(json格式 </a> </li> </ul> </div> </div> </div>
- ajax 对 Json 格式的解析
- ajax 对 Json 格式的解析
- ajax 对 Json 格式的解析
- ajax 对 Json 格式的解析
- JavaWeb中Ajax 对 Json 格式的解析
- ajax 对 json格式字符串解析
- Ajax技术(6)--ajax 对 html和Json 格式的解析
- 对json格式的数据进行解析
- ajax解析结合json格式
- 如何解析ajax传过来的JSON格式的字符串
- JSON格式的解析
- C#对XML、JSON等格式的解析
- C#对XML、JSON等格式的解析
- C#对XML、JSON等格式的解析
- C#对XML、JSON等格式的解析
- 对JSON格式数据的操作和解析和创建
- C#对XML、JSON等格式的解析
- 对JavaScript解析JSON格式数据的理解
- 【感想】百度 阿里 今日头条 面试感想
- Spring data jpa所需的全部jar包
- java使用POI实现替换文件中指定关键字
- 递归
- 一年Android工作经验,阿里 百度 网易 美团 小米 快手面经
- ajax 对 Json 格式的解析
- 2017年6月22号JAVA实习生笔试题(jiadu)+关于文本加密
- java多线程之生产者和消费者案例
- 【剑指offer】题14:调整数组顺序
- [LOJ6087]毒瘤题
- InvokeRequired和Invoke
- kmeans实现文本聚类
- 两年iOS开发之路
- python 生成拼接xml报文