jQuery解析Json字符串与对象的例子

 JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,易于人阅读和编写,同时也易于机器解析和生成,跟XML不相上下,在当今得到了广泛应用。有人说,当JS遇上Json,小JJ诞生啦;我说,当Json遇上xml,世界上又多了俩兄弟。近期看EasyUi视频里也全是Json作为前后台的数据交互,Json的有两种结构,分别是对象和数组:

1.对象:对象在js中表示为“{}”扩起来的内容,数据结构为: {key:value,key:value,…}
2.数组:数组在js中是中括号“[]”扩起来的内容,数据结构为: ["java","javascript","vb",...]
经过对象、数组2种结构就可以组合成复杂的数据结构了。简单认识了Json后,我们看看jQuery怎么解析Json字符串,如何应用到实际开发中,这里,列出两种解析方式:
 
一、jQuery解析Json数据格式:

这里首先给出JSON字符串集,字符串集如下:

 代码如下 复制代码

var data="
{
root:
[
{name:'1',value:'0'},
{name:'6101',value:'西安市'},
{name:'6102',value:'铜川市'},
{name:'6103',value:'宝鸡市'},
{name:'6104',value:'咸阳市'},
{name:'6105',value:'渭南市'},
{name:'6106',value:'延安市'},
{name:'6107',value:'汉中市'},
{name:'6108',value:'榆林市'},
{name:'6109',value:'安康市'},
{name:'6110',value:'商洛市'}
]
}";

这里以jquery异步获取的数据类型——json对象和字符串为依据,分别介绍两种方式获取到的结果处理方式。

1.对于服务器返回的JSON字符串,如果jquery异步请求没做类型说明,或者以字符串方式接受,那么需要做一次对象化处理,方式不是太麻烦,就是将该字符串放于eval()中执行一次。这种方式也适合以普通javascipt方式获取json对象,以下举例说明:

例子

 代码如下 复制代码

var dataObj=eval("("+data+")");//转换为json对象
alert(dataObj.root.length);//输出root的子对象数量
$.each(dataObj.root,fucntion(idx,item){
if(idx==0){
return true;
}

//输出每个root子对象的名称和值
alert("name:"+item.name+",value:"+item.value);
})

注:对于一般的js生成json对象,只需要将$.each()方法替换为for语句即可,其他不变。

例子

引入方法与简单实例
引入实例:

 代码如下 复制代码

<script type="text/javascript"  src="/js/jquery-1.2.6.min.js"></script><script type="text/javascript" src="/js/jquery.json.js"></script>

使用实例:

// 定义一个JS对象var thing = {plugin: 'jquery-json', version: 2.3};// 把JS对象转化为JSON字符串'{"plugin":"jquery-json","version":2.3}'var encoded = $.toJSON( thing );// 解析字符串为JS对象"jquery-json"var name = $.evalJSON( encoded ).plugin;//2.3var version = $.evalJSON(encoded).version;

2.对于服务器返回的JSON字符串,如果jquery异步请求将type(一般为这个配置属性)设为“json”,或者利用$.getJSON()方法获得服务器返回,那么就不需要eval()方法了,因为这时候得到的结果已经是json对象了,只需直接调用该对象即可,这里以$.getJSON方法为例说明数据处理方法:

 代码如下 复制代码

$.getJSON("http://www.111cn.net/",{param:"gaoyusi"},function(data){
//此处返回的data已经是json对象
//以下其他操作同第一种情况
$.each(data.root,function(idx,item){
if(idx==0){
return true;//同countinue,返回false同break
}

alert("name:"+item.name+",value:"+item.value);

});
});

 
二、jQuery解析Json对象:

jQuery提供了另一种方法“parseJSON”,这需要一个标准的JSON字符串,并返回生成的JavaScript对象。让我们来看看语法:

 代码如下 复制代码

data = $.parseJSON(string);

看看它是如何运用的到实际开发中的:

 代码如下 复制代码

jQuery.ajax({
url: dataURL,
success: function(results) {
var parsedJson = jQuery.parseJSON(results);
alert(parsedJson.name);
}
});

正如你所见,在这里,我已经使用parseJSON解析JSON字符串成对象,所以在这里你不能直接获得值,你需要使用对象得到的分析值。然而,JSON是相当简单的,易于阅读,一旦你习惯了大括号和括号,你将深切的感受到Json为咱带来的好处!

时间: 2024-08-31 05:18:58

jQuery解析Json字符串与对象的例子的相关文章

Jquery解析json字符串及json数组的方法

  本文实例讲述了Jquery解析json字符串及json数组的方法.分享给大家供大家参考.具体如下: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 6

jQuery怎么解析Json字符串(Json格式/Json对象)_jquery

json数据是我们常用的一种小型的数据实时交换的一个东西,他可以利用jquery或js进行解析,下面我来介绍jquery解析json字符串方法. 我们先以解析上例中的comments对象的JSON数据为例,然后再小结jQuery中解析JSON数据的方法. 上例中得到的JSON数据如下,是一个嵌套JSON: { "comments": [ { "content": "很不错嘛", "id": 1, "nickname&

jquery解析json格式数据的方法(对象、字符串)_jquery

本文实例讲述了jquery解析json格式数据的方法.分享给大家供大家参考,具体如下: json数据是我们常用的一种小型的数据实时交换的一个东西,他可以利用jquery或js进行解析,下面我来介绍jquery解析json字符串方法. 一.jQuery解析Json数据格式: 使用这种方法,你必须在Ajax请求中设置参数: dataType: "json" 获取通过回调函数返回的数据并解析得到我们想要的值,看源码: jQuery.ajax({ url: full_url, dataType

js jquery前台解析json字符串

一.js解析json字符串 eval()和JSON.parse() 对于服务器返回的JSON字符串,如果jquery异步请求没做类型说明,或者以字符串方式接受,那么需要做一次对象化处理,就是将该字符串放于eval()中执行一次.这种方式也适合以普通javascipt方式获取json对象,以下举例说明: var dataObj=eval("("+data+")");//转换为json对象 为什么eval这里要添加 "("+data+")&

Jquery通过JSON字符串创建JSON对象_jquery

<html> <body> <h2>通过 JSON 字符串来创建对象</h3> <p> First Name: <span id="fname"></span><br /> Last Name: <span id="lname"></span><br /> </p> <script type="text/ja

JQUERY用EVAL解析JSON字符串例子与注意事项

这里以jquery异步获取的数据类型--json对象和字符串为依据,分别介绍两种方式获取到的结果处理方式. 1.对于服务器返回的JSON字符串,如果jquery异步请求没做类型说明,或者以字符串方式接受,那么需要做一次对象化处理,方式不是太麻烦,就是将该字符串放于eval()中执行一次.这种方式也适合以普通javascipt方式获取json对象,以下举例说明: var dataObj=eval("("+data+")");//转换为json对象 alert(data

jquery 解析json与json 例子

jquery处理网页特效on的方法 jquery处理json的方法是直接eval,给一个变量,但是,今天看到其源代码,证明我的想法彻底错了. 它先判定有没有window.json.parse这个方法,如果有,直接用这个方法解析,如果没有,会new一个匿名函数,里面的内容,就是返回json的执行结果. 我试了一下,window.json这个对象,在firefox/webkit的浏览器中存在,但ie6-ie8都没有. 另外,如果大家需要解析json字符串,可以直接使用jquery的parsejson

jQuery怎么解析Json字符串

一.jQuery解析Json数据格式: 使用这种方法,你必须在Ajax请求中设置参数: 1 dataType: "json" 获取通过回调函数返回的数据并解析得到我们想要的值,看源码:  代码如下 复制代码 jQuery.ajax({      url: full_url,      dataType: "json",      success: function(results) {      alert(result.name);      } }); 通常情况

jQuery解析Json实例详解_jquery

本文实例讲述了jQuery解析Json的方法.分享给大家供大家参考,具体如下: 前言 在WEB数据传输过程中,json是以文本,即字符串的轻量级形式传递的,而客户端一般用JS操作的是接收到的JSON对象,所以,JSON对象和JSON字符串之间的相互转换.JSON数据的解析是关键. 先明确2个概念例如: JSON字符串: 复制代码 代码如下: var str1 = '{ "name": "deyuyi", "sex": "man"