JSON是一种网络中的数据格式,主要用于网络间的数据传输,它比XML格式的数据传输速度快,使用更广。

1.Ajax处理对象格式的JSON数据:

 <script src="../JS/jquery-1.12.4.min.js"></script>
<script>
function show(){
// Ajax使用GET简化方式,请求JSON数据
// get请求格式:get(url,传递给服务器的参数,请求成功后执行的函数,能够解析的数据格式)
$.get('student.json',{},function(response){
// 当请求成功JSON解析出来的数据有两个,一个是对象/数组,还有一个所示请求状态码
// response是解析后的数据,
// 如果JSON解析之前的数据是数组,那么response就是数组
// 如果JSON解析之前的数据是对象,那么response就是对象
var $name = $('#name');
var $age = $('#age');
var $sex = $('#sex');
var $school = $('#school');
$name.html(response.name);
$age.html(response.age);
$sex.html(response.sex);
$school.html(response.school);
},'JSON').error(function(){
alert('Error!');
});
// Ajax利用POST方式进行数据传输
$.post('student.json',{},function(response){
$('#name').html(response.name);
$('#age').html(response.age);
$('#sex').html(response.sex);
$('#school').html(response.school);
},'JSON').error(function(){
alert('Error!');
});
}
</script>

2.Ajax处理数组格式的JSON数据:

<script src="js/jquery-1.12.4.min.js"></script>
<script>
$(function(){
$.get('resume.json',{},function(response){
$('#photo').html("<img src='"+response[0]+"'>");
$('#name').html(response[1]);
$('#age').html(response[2]);
$('#school').html(response[3]);
$('#langage').html(response[4]);
$('#empiric').html(response[5]);
$('#habby').html(response[6]);
$('#reward').html(response[7]);
},'JSON').error(function(){
$('#div').html('<h1>对不起,请求错误!</h1>')
});
});
</script>

Ajax之处理不同格式的JSON数据的更多相关文章

  1. Jquery Ajax和getJSON获取后台普通Json数据和层级Json数据解析

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. ajax使用向Spring MVC发送JSON数据出现 org.springframework.web.HttpMediaTypeNotSupportedException: Content type 'application/x-www-form-urlencoded;charset=UTF-8' not supported错误

    ajax使用向Spring MVC发送JSON数据时,后端Controller在接受JSON数据时报org.springframework.web.HttpMediaTypeNotSupportedE ...

  3. AJAX 跨域请求 - JSONP获取JSON数据

    Asynchronous JavaScript and XML (Ajax ) 是驱动新一代 Web 站点(流行术语为 Web 2.0 站点)的关键技术.Ajax 允许在不干扰 Web 应用程序的显示 ...

  4. ajax请求解析springmvc返回的json数据

    需要使用的框架 spring3.0 jquery1.9.0(简化ajax开发的js库) Jackson(json处理器):jackson-core-asl-1.9.2.jar,jackson-mapp ...

  5. [ 转 ]jquery的ajax和getJson跨域获取json数据

    目前浏览器端跨域访问常用的两种方法有两种: 1.通过jQuery的ajax进行跨域,这其实是采用的jsonp的方式来实现的. jsonp是英文json with padding的缩写.它允许在服务器端 ...

  6. 【转】AJAX 跨域请求 - JSONP获取JSON数据

    来源:http://justcoding.iteye.com/blog/1366102/ Asynchronous JavaScript and XML (Ajax ) 是驱动新一代 Web 站点(流 ...

  7. jquery的ajax和getJson跨域获取json数据

    目前浏览器端跨域访问常用的两种方法有两种: 1.通过jQuery的ajax进行跨域,这其实是采用的jsonp的方式来实现的. jsonp是英文json with padding的缩写.它允许在服务器端 ...

  8. ASP.NET前台table通过Ajax获取绑定后台查询的json数据

    上一篇<ASP.NET前台html页面AJAX提交数据后台ashx页面接收数据>写了前台提交数据后台保存到数据库,数据处理以后用户肯定要查询.接下来就写一个前台table通过ajax  J ...

  9. java-生成任意格式的json数据

    最近研究java的东西.之前靠着自己的摸索,实现了把java对象转成json格式的数据的功能,返回给前端.当时使用的是 JSONObject.fromObject(object) 方法把java对象换 ...

随机推荐

  1. Tomcat介绍、安装JDK、安装Tomcat

    6月26日任务 16.1 Tomcat介绍16.2 安装jdk16.3 安装Tomcat扩展java容器比较 http://my.oschina.net/diedai/blog/271367 http ...

  2. ELK的简单搭建

    Environment  (都需要Java环境,jdk){ elasticsearch kibana 安装nginx用以测试 logstash } 1.首先拉取软件包,给予Java语言开发首选配置Ja ...

  3. [Java并发] AQS抽象队列同步器源码解析--锁获取过程

    要深入了解java并发知识,AbstractQueuedSynchronizer(AQS)是必须要拿出来深入学习的,AQS可以说是贯穿了整个JUC并发包,例如ReentrantLock,CountDo ...

  4. 这十道经典Python笔试题,全做对算我输

    经常有小伙伴学了Python不知道是否能去找工作,可以来看下这十道题检验你的成果: 1.常用的字符串格式化方法有哪些?并说明他们的区别 a. 使用%,语法糖 print("我叫%s,今年%d ...

  5. 《JavaScript 正则表达式迷你书》知识点小抄本

    介绍 这周开始学习老姚大佬的<JavaScript 正则表达式迷你书> , 然后习惯性的看完一遍后,整理一下知识点,便于以后自己重新复习. 我个人觉得:自己整理下来的资料,对于知识重现,效 ...

  6. redis(3)--redis原理分析

    过期时间设置 在Redis中提供了Expire命令设置一个键的过期时间,到期以后Redis会自动删除它.这个在我们实际使用过程中用得非常多.EXPIRE命令的使用方法为EXPIRE key secon ...

  7. Spring Boot (二) 整合 Redis

    前言 本文将会基于 springboot 2.1.8.RELEASE 简单整合 Redis ,适合新手小白入门 Spring Boot 整合 Redis 入门 1.pom.xml 中引入 redis ...

  8. Centos7使用离线安装包rpm安装MySQL5.6

    参考地址: https://blog.csdn.net/ai_64/article/details/100557530 https://dev.mysql.com/doc/refman/5.6/en/ ...

  9. 【hibernate】自定义转换器

    [hibernate]自定义转换器 转载:https://www.cnblogs.com/yangchongxing/p/10398255.html 1.转换基本属性 package cn.ycx.s ...

  10. CookieUtils-浏览器缓存工具类

    package cn.yonyong.myproject.commons.utils; import javax.servlet.http.Cookie; import javax.servlet.h ...