1. 语法

JSON(JavaScriptObject Notation)一种简单的数据格式,比xml更轻巧。JSON是JavaScript原生格式,这意味着在JavaScript中处理JSON数据不需要任何特殊的API或工具包。
JSON的规则很简单:对象是一个无序的“‘名称/值’对”集合。一个对象以“{”(左括号)开始,“}”(右括号)结束。每个“名称”后跟一个“:”(冒号);“‘名称/值’对”之间使用“,”(逗号)分隔。

规则如下:

1)映射用冒号(“:”)表示。名称:值

2)并列的数据之间用逗号(“,”)分隔。名称1:值1,名称2:值2

3)映射的集合(对象)用大括号(“{}”)表示。{名称1:值1,名称2:值2}

4)并列数据的集合(数组)用方括号(“[]”)表示。

[

{名称1:值,名称2:值2},

{名称1:值,名称2:值2}

]

5  元素值可具有的类型:string,number, object, array, true, false, null

2. 解析Json

JSON只是一种文本字符串。它被存储在responseText属性中
为了读取存储在responseText属性中的JSON数据,需要根据JavaScript的eval语句。函数eval
会把一个字符串当作它的参数。然后这个字符串会被当作JavaScript代码来执行。因为JSON
的字符串就是由 JavaScript代码构成的,所以它本身是可执行的.
例子一:
<script language="JavaScript">
var people ={"firstName": "Brett", "lastName":"McLaughlin", email": "brett@newInstance.com" };
alert(people.firstName);
alert(people.lastName);
alert(people.email);
</script>
例子二:
<script language="JavaScript">
var people =[
{"firstName": "Brett","email": "brett@newInstance.com" },
{"firstName": "Mary","email": "mary@newInstance.com" }
]; alert(people[0].firstName);
alert(people[0].email);
alert(people[1].firstName);
alert(people[1].email);
</script>
例子三:
<script language="JavaScript">
var people ={
"programmers": [
{ "firstName": "Brett", "email": "brett@newInstance.com" },
{ "firstName": "Jason", "email": "jason@servlets.com" },
{ "firstName": "Elliotte", "lastName":"Harold", "email": "elharo@macfaq.com" }
],
"authors": [
{ "firstName": "Isaac", "genre": "science fiction" },
{ "firstName": "Tad", "genre": "fantasy" },
{ "firstName": "Frank", "genre": "christian fiction" }
],
"musicians": [
{ "firstName": "Eric", "instrument": "guitar" },
{ "firstName": "Sergei", "instrument": "piano" }
]};
window.alert(people.programmers[1].firstName);
window.alert(people.musicians[1].instrument);
</script>

3. Json的优缺点

优点:
•作为一种数据传输格式,JSON与
XML 很相似,但是它更加灵巧。
•JSON不需要从服务器端发送含有特定内容类型的首部信息。
缺点:
•语法过于严谨
•代码不易读
•eval函数存在风险

4. 示例:

bean对象  province.java

public class Province {

	private Integer id;
private String province;
public Province(Integer id,String province) {
this.id = id;
this.province = province;
}
public Integer getId() {
return id;
}
public void setId(Integer id) {
this.id = id;
}
public String getProvince() {
return province;
}
public void setProvince(String province) {
this.province = province;
}
}

处理请求的JsonServlet.java,JSONArray 需要导入json的第三方包json-lib-2.3-jdk15.jar,及其依赖包。

public class JsonServlet extends HttpServlet {

	public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException { response.setContentType("text/html;charset=utf-8");
PrintWriter out = response.getWriter(); //利用javabean来模拟数据库
Province p1 = new Province(1, "吉林省");
Province p2 = new Province(2, "辽宁省");
Province p3 = new Province(3, "山东省"); List<Province> list = new ArrayList<Province>(); list.add(p1);
list.add(p2);
list.add(p3); JSONArray json = JSONArray.fromObject(list); //String json = "[{'province':'吉林省'},{'province':'辽宁省'},{'province':'山东省'}]"; out.println(json.toString()); //响应始终以字符串形式 }
}

显示页面 json.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>form.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
</head>
<body>
<select id="province" name="province">
<option value="">请选择....</option>
</select>
<select id="city" name="city">
<option value="">请选择.....</option>
</select>
</body>
<script language="JavaScript">
window.onload = function(){
var xhr = ajaxFunction(); xhr.onreadystatechange = function(){
if(xhr.readyState==4){
if(xhr.status==200){
var data = xhr.responseText; alert(data);
/*
* 利用eval()函数转换成json数据格式,传入eval()函数的内容还是文本内容
* * 利用eval()函数进行转换json数据格式,需要利用"()"将传入的参数进行包裹
* * 如果不利用"()"进行包裹,传入的内容是"{}",这时eval()函数会将其识别成"空的语句块"
* * 如果利用"()"进行包裹,传入的内容是"{}",这时eval()函数会强行将其转换成json格式
*
* * 加上"()"一定转换成功
*/
var json = eval("("+data+")"); for(var i=0;i<json.length;i++){
var provinceValue = json[i].province; var optionElement = document.createElement("option");
optionElement.setAttribute("value",provinceValue);
var provinceText = document.createTextNode(provinceValue);
optionElement.appendChild(provinceText); var provinceElement = document.getElementById("province");
provinceElement.appendChild(optionElement);
}
}
}
} xhr.open("post","../jsonServlet?timeStamp="+new Date().getTime(),true); xhr.send(null);
} function ajaxFunction(){
var xmlHttp;
try{ // Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e){
try{// Internet Explorer
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e){
try{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e){}
}
} return xmlHttp;
} </script>
</html>

Json -- 语法和示例,javascript 解析Json的更多相关文章

  1. JavaScript解析json

    后台数据经常以json数据格式传回前台,解析当然首选JSON对象. JSON对象有两个方法,使用JSON.parse(str)可以将json字符串解析成js中的对象. var o = JSON.par ...

  2. json进阶(一)js读取解析JSON类型数据

    js读取解析JSON类型数据 一.什么是JSON? JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,是理想的数据交换格式,同 ...

  3. 【C#】使用Json.NET(newtonsoft)解析Json

    最近做的WPF项目中,需要一个C#下的Json实现. 在Json的官网http://www.json.org/中查找,可见C#的Json工具主要有如下: 尝试了排在最前面的fastJSON,反序列化时 ...

  4. JSON.parse 与 eval() 对于解析json的问题

    1.eval()与JSOn.parse的不同 eval() var c = 1; //全局变量 var jsonstr1 = '{"name":"a",&quo ...

  5. 将JSON格式数据转换为javascript对象 JSON.parse()

    <html><body><h2>通过 JSON 字符串来创建对象</h3><p>First Name: <span id=" ...

  6. VBA中使用JavaScript脚本语言解析JSON数据

    JSON:JavaScript 对象表示法(JavaScript Object Notation) 和xml相似,都是文本形式(保存在文本文件中或字符串等形式),比如: jsstr = {" ...

  7. 小白科普之JavaScript的JSON

    一.对json的理解     json是一种数据格式,不是一种编程语言,json并不从属于javascript.     json的语法可以表示以下三种类型的值     1)简单值           ...

  8. C++解析JSON之JsonCPP

    一.JSON简介 JSON全称为JavaScript ObjectNotation,它是一种轻量级的数据交换格式,易于阅读.编写.解析. JSON由两种基本结构构成: )"名称/值" ...

  9. jquery遍历筛选数组的几种方法和遍历解析json对象

    jquery grep()筛选遍历数组 $().ready(    function(){        var array = [1,2,3,4,5,6,7,8,9];        var fil ...

随机推荐

  1. Objective-C规范注释心得——同时兼容appledoc(docset、html)与doxygen(html、pdf)的文档生成

    作者:zyl910 手工写文档是一件苦差事,幸好现在有从源码中抽取注释生成文档的专用工具.对于Objective-C来说,目前最好用的工具是appledoc和doxygen.可是这两种工具对于注释的要 ...

  2. JavaWeb项目(SSM)准备工作

    1.新建dynamic web project(Maven project也行) 我用的Eclipse + ssm + mysql 2.准备jar包 整合ssm的包1. springmvc: ...2 ...

  3. CodeForces 666B World Tour(spfa+枚举)

    B. World Tour time limit per test 5 seconds memory limit per test 512 megabytes input standard input ...

  4. .net时间格式与彻夜未眠的我

    夜已经很深了,外面的狂风还在呜呜的叫着,我的脚已经冰凉冰凉...从11点半到现在我一直在测试为什么正确的Json格式字符串传到服务器后还在报400错误... 尼玛啊,以前测试是没有问题的啊 事情是这样 ...

  5. visual studio 下 C++生成dump文件

    1 lib配置 项目-->属性-->配置属性-->链接器-->输入-->附加依赖项 增加dbghelp.lib 2 头文件 #include <imagehlp.h ...

  6. JS给html控件赋值

    <html> <head> <title> JS给html控件赋值 </title> <script language="javascr ...

  7. Centos 软链接命令(十)

    链接命令:ln  (link) ln -s [源文件] [目标文件] 功能描述:生成链接文件 选项: -s 创建软链接 硬链接特征: 1,拥有相同的i节点和存储block块,可以看作是同一个文件: 2 ...

  8. pycharm的MySQLdb模块导不进去时解决办法

    一.Windows下python2.7安装MySQLdb模块 根据Python多少位下载对应版本: 32位:https://pypi.python.org/pypi/MySQL-python/1.2. ...

  9. 通信—HTTP与HTTPS

    HTTP是客户端浏览器或其他程序与Web服务器之间的应用层通信协议.在Internet上的Web服务器上存放的都是超文本信息,客户机需要通过HTTP协议传输所要访问的超文本信息. HTTPS(全称:H ...

  10. R语言seq()函数用法

    1.seq() 用来生成一组数字的函数. Usage: ## Default S3 method:seq(from = 1, to = 1, by = ((to - from)/(length.out ...