AJAX——Json
一、简介:
客户端利用Ajax请求服务器端时,数据在两者之间通常有两种格式:XML格式的数据;Json(JavaScript Object Notation/JavaScript 对象表示法)格式数据。
XML:跨平台,跨语言,是在Web Services中的通用格式。其结构包括:元素、属性、文本等;但用 javascript 操作较复杂。(1)读取 XML 文档(2)使用 XML DOM 来循环遍历文档(3)读取值并存储在变量中。
Json:是存储和交换文本信息的语法文本。类似 XML。JSON 比 XML 更小、更快,更易解析。作为一种轻量级的数据交换格式,主要是为js服务。JSON 文本格式在语法上与创建 Js对象的代码相同。由于这种相似性,无需解析器,JavaScript 程序能够使用内建的 eval() 函数,用 JSON 数据来生成原生的 JavaScript 对象,因此JS可以利用从该对象中获取属性的方式提取数据,而不需要处理DOM。(1)读取 JSON 字符串(2)用 eval() 处理 JSON 字符串(3)从Json对象中获取属性的方式提取数据
- JSON 文件的文件类型是 ".json"
- JSON 文本的 MIME 类型是 "application/json"
XML和JSON的相同点: 是 具有“自我描述性”的纯文本,具有层级结构,可通过 JavaScript 进行解析,可使用 AJAX 进行传输;
二、Json语法
Json的语法就是javascript对象的语法,如下:
{FXTJ: [
{name:'高风险',data:[{ name: '高风险', color: '#FF00FF',y:0},{ name: '高风险', color: '#FF00FF',y:2},{ name: '高风险', color: '#FF00FF',y:0}]},
{name:'中风险',data:[{ name: '中风险', color: '#e4d354',y:4},{ name: '中风险', color: '#e4d354',y:2},{ name: '中风险', color: '#e4d354',y:4}]},
{name:'低风险',data:[{ name: '低风险', color: '#00FF00',y:2},{ name: '低风险', color: '#00FF00',y:2},{ name: '低风险', color: '#00FF00',y:2}]}
]
}
json内容要放在{}中,用以表示对象。数据以名/值对的形式保存类似于JS中对象的属性、属性值,各个数据之间以“,”隔开。当值有多个时,用[]表示。如上面,FXTJ是一个对象,其有三个子对象,所以子对象用[]包裹起来。
名值对定义如下:名可以加“”,也可以不加,而值则有以下类型:数字(整数或浮点数)、字符串(在双引号中)、逻辑值(true 或 false)、数组(在方括号中)、对象(在花括号中)、null。如name:'高风险'。name为名,'高风险'为值,中间用:隔开。
三、Json用法
1、 eval ()
eval()方法可以把JavaScript字符串当作参数,还可以将该字符串转换成对象,或作为命令动作。如果使用XMLHttpRequest对象的responseText属性请求JSON数据,那么使用eval()将JSON文本字符串转换成JavaScript对象。因为JSON字符串常包包含花括号,所以用圆括号来括住JSON字符串,以表明字它是一个求值表达式,而不是一个要运行的命令。
var jsonResp=request.responseText;
jsonResp=eval(“(”+jsonResp+”)”);
例:var strjson=eval("({FXTJ: [{name:'高风险',data:[{ name: '高风险', color: '#FF00FF',y:0},{ name: '高风险', color: '#FF00FF',y:2},{ name: '高风险', color: '#FF00FF',y:0}]},
{name:'中风险',data:[{ name: '中风险', color: '#e4d354',y:4},{ name: '中风险', color: '#e4d354',y:2},{ name: '中风险', color: '#e4d354',y:4}]},
{name:'低风险',data:[{ name: '低风险', color: '#00FF00',y:2},{ name: '低风险', color: '#00FF00',y:2},{ name: '低风险', color: '#00FF00',y:2}]}
]
})")
则该字符串变为一个对象,strjson指向该对象。获取值得方式:strjson.FXTJ[0].name; //为'高风险' ;修改值:strjson.FXTJ[0].name=“无风险”
2、JSON.parse()
IE8+及其他浏览器均支持,使用方法如下:
var jsonData = '{"data1":"Hello,", "data2":"world!}';
var jsonParseJson=JSON.parse(jsonData);
3、使用JSON解析器
如果Web服务器既提供JSON数据也提供请求页面,则适合选用eval()方法。如果涉及安全,则适合使用JSON解析器。JSON解析器只作用于JSON文本,JSON 解析器只能识别 JSON 文本,而不会编译脚本。而且 JSON 解析器的速度更快。在这种情况下,可以使用responseText,但要使用parseJSON()方法将JSON文本字符串转换成JavaScript对象。要访问parseJOSN函数,需要要添加引用json.js文件到页面中。
var jsonResp=request.responseText;
jsonResp=jsonResp.parseJSON();
可以使用JSON解析器从对象和数组中创建JSON文本或者JSON文本中创建对象和数组。JSON站占www.json.rog/json.js上提供有JSON解析器,通过将下列代码加入到页面的头部上即可使用。JSON解析器提供了两个函数:toJSONString()和parseJSON()。
- toJSONString()方法被添加到JavaScript Object和Array定义中,该方法能将JavaScript对象或数组转换成JSON文本。不必将对象或数组转换成字面量就能使用该方法。
- parseJSON()方法能从JSON文本中创建对象或数组。
AJAX——Json的更多相关文章
- struts2 + ajax + json的结合使用,实例讲解
struts2用response怎么将json值返回到页面javascript解析,这里介绍一个struts2与json整合后包的用法. 1.准备工作 ①ajax使用Jquery:jquery-1.4 ...
- AJAX,JSON搜索智能提示
效果 开发结构参考AJAX,JSON用户校验 主要有两个核心文件 1,处理输入字符,进行后台搜索的servlet Suggest.java package org.guangsoft.servlet; ...
- php ajax json jquery 记录
php+jquery+ajax+json简单小例子 <html> <title>php+jquery+ajax+json简单小例子</title> <?php ...
- 练习 jquery+Ajax+Json 绑定数据 分类: asp.net 练习 jquery+Ajax+Json 绑定数据 分类: asp.net
练习 jquery+Ajax+Json 绑定数据
- Jquery+ajax+json+servlet原理和Demo
Jquery+ajax+json+servlet原理和Demo 大致过程: 用户时间点击,触发js,设置$.ajax,开始请求.服务器响应,获取ajax传递的值,然后处理.以JSON格式返回给ajax ...
- 玩转Web之Json(一)-----easy ui+ajax + json 中关于Json的解析问题
在easy ui中使用Ajax+Json实现前后的数据交互时,当后台数据传输到客户端是需对Json数据进行解析,这里将对Json数据解析做简单总结. (一) 对于服务器返回的数据若没有做类型说明,需要 ...
- php+jquery+ajax+json简单小例子
直接贴代码: <html> <title>php+jquery+ajax+json简单小例子</title> <?php header("Conte ...
- JFreeChart与AJAX+JSON+ECharts两种处理方式生成热词统计可视化图表
本篇的思想:对HDFS获取的数据进行两种不同的可视化图表处理方式.第一种JFreeChar可视化处理生成图片文件查看.第二种AJAX+JSON+ECharts实现可视化图表,并呈现于浏览器上. 对 ...
- Struts+Spring+Hibernate项目整合AJAX+JSON
1.什么是AJAX AJAX是 "Asynchronous JavaScript and XML" 的简称,即异步的JavaScript和XML. 所谓异步,就是提交一个请求不必等 ...
- 基于Jquery+Ajax+Json+存储过程 高效分页
在做后台开发中,都会有大量的列表展示,下面给大家给大家分享一套基于Jquery+Ajax+Json+存储过程高效分页列表,只需要传递几个参数即可.当然代码也有改进的地方,如果大家有更好的方法,愿留下宝 ...
随机推荐
- C# 反射通过GetCustomAttributes方法,获得自定义特性
http://blog.csdn.net/litao2/article/details/17633107 使用反射访问: 自定义属性的信息和对其进行操作的方法. 一.实例1 1.代码: 如:Syste ...
- review39
不可以在非同步方法中使用wait().notify()和notifyAll().
- 考虑 PHP 5.0~5.6 各版本兼容性的 cURL 文件上传
最近做的一个需求,要通过PHP调用cURL,以multipart/form-data格式上传文件.踩坑若干,够一篇文章了. 重要警告 没事不要读PHP的官方中文文档!版本跟不上坑死你! 不同版本PHP ...
- FreeDOS 实模式 保护模式
FreeDOS可以运行在实模式或保护模式下,在启动FreeDOS时有4种运行模式选择: 前两种运行在保护模式下, 后两种运行在实模式下. 根据How to tell whether your CPU ...
- SSIS包的开发
在上一章节中我们初步了解了SSIS体系结构以及如何创建一个SSIS包.现在就介绍一下如何在创建的包中使用各个选项卡.打开上一章节创建的SSIS包.整个界面风格如下: 在整个包中包含了控制流选项卡.数据 ...
- python中的数据类型和常用运算符
一. python中常见的数据类型 1. 整数:任何时候运算都是精确的 2. 浮点数:运算的时候,可能会有四舍五入 3. 字符串:字符串是以单引号'或双引号"括起来的任意文本 1) 同类型的 ...
- Unity 3D 离线协议
在联网状态下,获得离线协议,然后导入到Untiy的协议管理器里. 以后在断网的情况下,也能离线使用Unity. 步骤: 1.生成 Request 文件.(Unity_v5.3.1f1.alf) 1) ...
- App Store下载Mac应用失败的解决办法
1. 更换DNS服务器 国内可以用alidns: 223.5.5.5 223.6.6.6 也可以用电信的: 114.114.114.114 国外的可以考虑Google 8.8.8.8 8.8.4.4 ...
- Multiprovide 实践理解
“多重提供器”是一种“信息提供者”,它综合了多个“信息提供者”的数据以用于报告.“多重提供者”本身不包含任何数据.“多重提供者”的数据由所基于的“信息提供者”专门提供,这些“信息提供者”组合在一起进行 ...
- 如何将Emmet安装到到 Sublime text 3?第二部分该插件还能让我们自定义快捷键呼出某个浏览器以预览页面
看清楚哦~~这是Sublime text 3不是2的版本,两者的安装还是有区别的,下面的方法是我感觉比较简单的,其他的要命令什么的感觉太复杂了,经测试是OK的. 先关闭Sublime text 3: ...