Json -- 语法和示例，javascript 解析Json
1. 语法
规则如下:
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
会把一个字符串当作它的参数。然后这个字符串会被当作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的优缺点
XML 很相似，但是它更加灵巧。
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的更多相关文章
- JavaScript解析json
后台数据经常以json数据格式传回前台,解析当然首选JSON对象. JSON对象有两个方法,使用JSON.parse(str)可以将json字符串解析成js中的对象. var o = JSON.par ...
- json进阶(一)js读取解析JSON类型数据
js读取解析JSON类型数据 一.什么是JSON? JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,是理想的数据交换格式,同 ...
- 【C#】使用Json.NET（newtonsoft）解析Json
最近做的WPF项目中,需要一个C#下的Json实现. 在Json的官网http://www.json.org/中查找,可见C#的Json工具主要有如下: 尝试了排在最前面的fastJSON,反序列化时 ...
- JSON.parse 与 eval() 对于解析json的问题
1.eval()与JSOn.parse的不同 eval() var c = 1; //全局变量 var jsonstr1 = '{"name":"a",&quo ...
- 将JSON格式数据转换为javascript对象 JSON.parse()
<html><body><h2>通过 JSON 字符串来创建对象</h3><p>First Name: <span id=" ...
- VBA中使用JavaScript脚本语言解析JSON数据
JSON:JavaScript 对象表示法(JavaScript Object Notation) 和xml相似,都是文本形式(保存在文本文件中或字符串等形式),比如: jsstr = {" ...
- 小白科普之JavaScript的JSON
一.对json的理解 json是一种数据格式,不是一种编程语言,json并不从属于javascript. json的语法可以表示以下三种类型的值 1)简单值 ...
- C++解析JSON之JsonCPP
一.JSON简介 JSON全称为JavaScript ObjectNotation,它是一种轻量级的数据交换格式,易于阅读.编写.解析. JSON由两种基本结构构成: )"名称/值" ...
- jquery遍历筛选数组的几种方法和遍历解析json对象
jquery grep()筛选遍历数组 $().ready( function(){ var array = [1,2,3,4,5,6,7,8,9]; var fil ...
随机推荐
- [LintCode] 带重复元素的排列
递归实现: class Solution { public: /** * @param nums: A list of integers. * @return: A list of unique pe ...
- The Ultimate Guide To A/B Testing
w http://blog.jobbole.com/25576/?utm_source=blog.jobbole.com&utm_medium=relatedPosts https://www ...
- iOS核心动画详解（CABasicAnimation）
前言 上一篇已经介绍了核心动画在UI渲染中的位置和基本概念,但是没有具体介绍CAAnimation子类的用法,本文将介绍CABasicAnimation及其子类CASpringAnimation的用法 ...
- Date、Calendar、Timestamp的区别与转换
1.Java.util.Date 包含年.月.日.时.分.秒信息. // String转换为Date String dateStr="2013-8-13 23:23:23"; St ...
- Pycharm在创建py文件时,自动添加文件头注释
依次File -> Settings -> Editor -> File and Code Templates -> Python Script 添加以下代码: # -*- ...
- android学习四---Activity和Intent
1.android项目资源深入了解 在深入学习android之前,先好好玩玩手机上的应用,大部分程序都有一个图标,点开图标,程序启动,一定时间后,程序会跳转到第一个界面,比如手机QQ,点开图标,会跳出 ...
- Appium中的logger
原文地址http://blog.csdn.net/itfootball/article/details/45395901 appium中的log输出量很大,我们分析问题的时候会依赖于这些log,但是你 ...
- Linux基础以及简单命令
1. UNIX是什么 UNIX是一个计算机操作系统,一个用来协调.管理和控制计算机硬件和软件资源的控制程序.特点:多用户和多任务 2. GNU项目与自由软件 GPL条款是为保证GNU软件可以自由地使用 ...
- 虚拟环境virtualenv和virtualenvwrapper(转)
virtualenv是用来创建一个独立的Python虚拟环境的工具,通过virtualenv可以创建一个拥有独立的python版本和安装库的虚拟开发环境.这样一来我们就可以在虚拟环境中安装各种各种所需 ...
- 第三课 Makefile文件的制作(上)
1.序言: 前面的课程讲解了从gcc编译过程到其实践,大家可以看到其实在这些步骤中有些是可以简化编译的,但由于参数多以及项目中文件数量多的原因难免会造成错误甚至是浪费大量的时间在这编译上,为此linu ...