jquery ajax获取json并解析,获取的json是object对象格式
首先我们使用的是ajax方式,推荐一个学习网址:
http://blog.csdn.net/shiyaru1314/article/details/51065410
这个博主写的特别好。现在来看我们的例子:
这里是没有参数的get方式:
function tryapitest(){
$.ajax({
url:"/api/category/top/all",
type:"get",
dataType:"json",
success: function(data) {
console.log(data);
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
alert(XMLHttpRequest.status);
alert(XMLHttpRequest.readyState);
alert(textStatus);
},
})
}
控制台打印出的数据如下:
可以看到,我们获取的data由三级组成:ststus,msg,data;
那么接下来,我们需要获取data:Array(12)这个数据;
因此在success函数里面添加如下:
success: function(data) {
//console.log(data);
var item=data.data;
console.log(item);
}
},
此时查看console控制台的输出信息:
可以看到此时已经获得Object的信息了,但是如果需要获取Object里面具体的属性,必须要将Object进行遍历:
代码如下:
success: function(data) {
//console.log(data);
var item=data.data;
//console.log(item);
for(var i=0;i<item.length;i++){
console.log(item[i]);
}
},
查看控制台的信息:
此时就可以获取对应的数据和属性啦。Object对象必须要遍历之后才可以获取里面的属性,直接item.id是不可以的,必须要item[i].id才可以。
我们可以将属性打印在网页上,代码如下:
success: function(data) {
//console.log(data);
var item=data.data;
// console.log(item);
var htm = "";
htm += "<table><thead><tr><th>ID</th><th>name</th><th>enName</th></tr></thead><tbody>";
for(var i=0;i<item.length;i++){
//console.log(item[i].name);
htm += '<tr><td>' + item[i].id + '</td><td>'
+ item[i].name + '</td><td>'
+ item[i].enName + '</td><td>';
}
htm += '</tbody></table>';
$("#apitesttry").append(htm);
},
页面展示如下:
这里使用的是for方法进行循环,还有each等方法,博主自己目前才学习到这里,遇到其他难点再来给大家分享吧~
jquery ajax获取json并解析,获取的json是object对象格式的更多相关文章
- js中JSON的解析(将json字符串转化为对象)和序列化(将对象转化为json字符串)(函数的功能一般都挺全的,需要的时候去查看完整函数)
js中JSON的解析(将json字符串转化为对象)和序列化(将对象转化为json字符串)(函数的功能一般都挺全的,需要的时候去查看完整函数) 一.总结 1.JSON解析:JSON.parse(myJS ...
- JSON在线解析,新版本JSON在线解析
SOJSON,出了新版本的JSON在线解析,真的很好用,可以上下版本.左右版本.效果图如下.它的网址是:http://www.sojson.com/simple_json.html SOJSON集成了 ...
- UI5-技术篇-jQuery.ajax执行过程中Token验证及JSON格式传值问题
最近两天在测试OData服务类方法CREATE_DEEP_ENTITY及GET_EXPANDED_ENTITYSET,刚开始采用ODataModel方式调用没有任何问题,但是ODataModel采用的 ...
- JMeter 插件 Json Path 解析 HTTP 响应 JSON 数据(转)
JMeter 是一个不错的负载和性能测试工具,我们也用来做 HTTP API 接口测试.我们的 API 返回结果为 JSON 数据格式.JSON 简介,JSON 教程. JSON 已经成为数据交换格式 ...
- php 解析json失败,解析为空,json在线解析器可以解析,但是json_decode()解析失败(原)
$str2='{"code":200,"datas":{"id":1,"coupon_id":"123&quo ...
- jquery ajax 后台响应成功,返回正确json但不执行success方法,执行error的问题
昨天被这问题卡了好几个小时.查看http状态码:是200.而且返回了预想的json字符串.但执行的是error方法,不执行success方法.在网上查了一下,才发现是后台页面返回的json字符串格式不 ...
- JMeter 插件 Json Path 解析HTTP响应JSON数据
一.基本简介 JMeter 是一个不错的负载和性能测试工具,我们也用来做 HTTP API 接口测试.我们的 API 返回结果为JSON数据格式.JSON 简介,JSON 教程. JSON 已经成为数 ...
- c# json数据解析——将字符串json格式数据转换成对象
网络中数据传输经常是xml或者json,现在做的一个项目之前调其他系统接口都是返回的xml格式,刚刚遇到一个返回json格式数据的接口,通过例子由易到难总结一下处理过程,希望能帮到和我一样开始不会的朋 ...
- c# json数据解析——将字符串json格式数据转换成对象或实体类
网络中数据传输经常是xml或者json,现在做的一个项目之前调其他系统接口都是返回的xml格式,刚刚遇到一个返回json格式数据的接口,通过例子由易到难总结一下处理过程,希望能帮到和我一样开始不会的朋 ...
随机推荐
- P4097 [HEOI2013]Segment
传送门 简单来说就是对于每条线段,先把它拆成\(O(logn)\)条,然后对于每一条再\(O(logn)\)判断在所有子区间的优劣程度 //minamoto #include<bits/stdc ...
- npm更换为淘宝镜像源
1.通过config命令 1 2 npm config set registry http://registry.cnpmjs.org npm info underscore (如果上面配置正确这 ...
- 洛谷 P1064 金明的预算方案(有依赖的背包问题)
题目描述 金明今天很开心,家里购置的新房就要领钥匙了,新房里有一间金明自己专用的很宽敞的房间.更让他高兴的是,妈妈昨天对他说:“你的房间需要购买哪些物品,怎么布置,你说了算,只要不超过N元钱就行”.今 ...
- [SHOI2013]超级跳马
题目描述 现有一个n 行m 列的棋盘,一只马欲从棋盘的左上角跳到右下角.每一步它向右跳奇数列,且跳到本行或相邻行.跳越期间,马不能离开棋盘.试求跳法种数mod 30011. 输入输出格式 输入格式: ...
- kafka启动时出现FATAL Fatal error during KafkaServer startup. Prepare to shutdown (kafka.server.KafkaServer) java.io.IOException: Permission denied错误解决办法(图文详解)
首先,说明,我kafk的server.properties是 kafka的server.properties配置文件参考示范(图文详解)(多种方式) 问题详情 然后,我启动时,出现如下 [hadoop ...
- postgreSQL在Centos6下编译安装
1.准备安装源 下载地址:https://www.postgresql.org/ftp/source/ 下载并解压. 2.软件编译安装 配置.检查安装环境 ./configure --prefix=/ ...
- solr深分页,游标操作分页,解决性能问题
solr深分页,游标操作分页,解决性能问题 @Test public void pageByCursor() { try { solrServer.connect(); String query = ...
- CentOS上oracle 11g R2数据库安装折腾记
1.虚拟机上centos镜像的获取.这里推荐网易镜像站中的CentOS7版本(其他开源镜像站亦可).这里给出链接: http://mirrors.163.com/centos/7.3.1611/iso ...
- 梦想CAD控件COM接口标注样式
增加标注样式 用户可以增加标注样式到数据库,具体实现c#代码如下: private void CreateDim() { //返回控件的数据库对象 MxDrawDatabase database = ...
- 26-Ubuntu-文件和目录命令-其他命令-管道
管道 Linux允许将一个命令的输出可以通过管道作为另一个命令的输入. 可以理解为现实生活中的管子,管子的一头塞东西进去,另一头取出来,这里的 | 左右分为两端,左端塞东西(写),右端取东西(读). ...