Detailed explanation of jQuery parsing Json examples_jquery

The example in this article describes how jQuery parses Json. Share it with everyone for your reference, the details are as follows:

Foreword

In the process of WEB data transmission, json is transmitted in the form of text, that is, a lightweight form of string , and the client generally uses JS to operate on the received JSON object, so the key is the conversion between JSON objects and JSON strings and the parsing of JSON data.

First clarify 2 concepts. For example:

JSON string:

Copy code The code is as follows:

var str1 = '{ "name": "deyuyi", "sex": "man" }';

JSON object:

Copy code The code is as follows:

var str2 = { "name": "deluyi", "sex": "man" };

It can be easily understood like this :

JSON object is a format that can be directly operated by JQuery, just like in C# you can use an object (class name) to point out attributes (methods);

JSON string is just A string, a whole. Without interception, there is no way to retrieve the data stored in it. It cannot be used directly unless you just want to alert() it;

1. Convert JSON string to JSON object

To use the above str1, you must use the following method to convert it into a JSON object first:

A: eval function

The eval function can Directly convert strings that essentially conform to or approximately conform to JSON format into JSON objects, using methods such as:

eval('(' str ')'); //where str is the string that satisfies the description of this title

//由JSON字符串转换为JSON对象
var str='{ "name": "John" }';
var obj = eval('(' + str + ')'); 
alert( obj.name);
var str2="{ 'name': 'John' }";
var obj2 = eval('(' + str2 + ')'); 
alert( obj2.name);
var str3="{ name: 'John' }";
var obj3 = eval('(' + str3 + ')'); 
alert( obj3.name);

The above will output the result "john".

Eval method can convert the following standard and non-standard format strings:

var str="{ 'name': 'John' }";
var str2='{ "name": "John" }';
var str3="{ name: 'John' }";

See this example download In the package: JqueryDemo1.html

B: parseJSON function

Another function that converts standard strings to JSON objects is parseJSON(), used like jQuery .parseJSON(str)//where str is the string that satisfies the description of this title

//由JSON字符串转换为JSON对象
var str='{ "name": "John" }';
var obj = jQuery.parseJSON(str)
alert("1"+ obj.name);

The above results will be output." john".

This method only supports the standard format: var str='{ "name": "John" }';

See the download package for this example: JqueryDemo2.html

C: JSON.parse function

There is also a function that converts standard strings into JSON objects is JSON.parse(), which can be used as JSON.parse(str)// Where str is the string that satisfies the description of this title

var str = '{ "name": "mady", "age": "24" }';
var obj = JSON.parse(str);
alert(obj.name);

All of the above will output the result "john".

This method only supports the standard format: var str='{ "name": "John" }';

See the download package for this example: JqueryDemo3.html

The above results are consistent, and all names are output, as shown below:

Special note: If obj is originally a JSON object, use the eval() function After conversion (even multiple conversions), it is still a JSON object, but there will be problems (throwing a syntax exception) after using the parseJSON() function.

D: Other method

If you can’t help but want to make a mistake, you really want to parse non-standard and irregular strings, such as:

Copy code The code is as follows:

{name:mady,age:23}

or

Copy code The code is as follows:

{name:'mady',age:23}

and other essentially correct illegal formats you can think of, then there are extension libraries that can solve it

jquery-json The extension library

The download address is here:

http://code.google.com/p/jquery-json/

This library is used to extend jQuery , for the use of JSON, two functions have been extended: toJSON and parseJSON

toJSON function is used to serialize an ordinary JavaScript object into a JSON object.

The parseJSON function is used to serialize an ordinary JavaScript object into a JSON object too.

var data=$.toJSON({ x: 2, y: 3 }); 
var obj = jQuery.parseJSON(data); 
alert(obj.x); 
var str = {plugin: 'jquery-json', version: 2.3}; 
var data2=$.toJSON(str); 
var obj2 = jQuery.parseJSON(data2); 
alert(obj2.plugin);

The execution result of the above code is as follows:

See the download package for this example: JqueryDemo5.html

2. Convert the JSON object into a string

You can use toJSONString() or the global method JSON.stringify( ) Converts JSON objects into JSON strings.

For example:

Copy the code The code is as follows:

var last=obj.toJSONString(); //将JSON对象转化为JSON字符

or

var last=JSON.stringify(obj); //将JSON对象转化为JSON字符
alert(last);

三、解析读取JSON

我们通过各种方式将字符串转换为JSON对象后就是解析他了。
如上面的例子：

复制代码 代码如下:

var str2 = { "name": "mady", "sex": "man" };

就可以这样读取：

复制代码 代码如下:

alert(str2.name);//和C#一样直接往出点…

弹出” mady”。
我们遇到的JSON很少有这么简单的，比如复杂一点的JSON对象如：

复制代码 代码如下:

var str={"GetUserPostByIdResult":{"Age":"33","ID":"2server","Name":"mady"}};

解析用：

      alert(str.GetUserPostByIdResult.Name);//一次点不出来，我多点几次

再再复杂一点的如：

复制代码 代码如下:

var data=" { root: [ {'name':'6200','value':'0'}, {'name':'6101','value':'xa'}, 
{'name':'6102','value':'beijing'}, {'name':'6103','value':'haerbin'}]}";

如果你想单挑的话，解析用：

复制代码 代码如下:

alert(dataObj.root[0].name);

弹出：“6200”。

如果你想群挑的话，解析用：

$.each(dataObj.root, function(index, item) {
  $("#info").append(
      "" +index+":"+ item.name + "" + 
      "" +index+":"+ item.value + "");
});

其中这个“#info”是个DIV的ID。输入结果如下图：

 

参见本例下载包中：JqueryDemo4.html

注意：本例如果要使用其他转换函数请更改字符串内单引号为双引号，外引号为单引号。
本文完整实例代码代码点击此处本站下载。

以上就是jQuery解析Json实例详解_jquery的内容，更多相关内容请关注PHP中文网（www.php.cn）！