Home  >  Article  >  Web Front-end  >  jquery JSON parsing method_jquery

jquery JSON parsing method_jquery

WBOY
WBOYOriginal
2016-05-16 18:49:14949browse

What is considered here is that the server returns a string in JSON form. For JSON objects encapsulated by plug-ins such as JSONObject, the same is true and will not be explained here.

The JSON string set is first given here. The string set is as follows:

Copy code The code is as follows:

var data="
{
root:
[
{name:'1',value:'0'},
{name:'6101 ',value:'Xi'an City'},
{name:'6102',value:'Tongchuan City'},
{name:'6103',value:'Baoji City'},
{ name:'6104',value:'Xianyang City'},
{name:'6105',value:'Weinan City'},
{name:'6106',value:'Yan'an City'},
{name:'6107',value:'Hanzhong City'},
{name:'6108',value:'Yulin City'},
{name:'6109',value:'Ankang City'},
{name:'6110',value:'Shangluo City'}
]
}";

The data type obtained asynchronously with jquery—— Based on json objects and strings, the result processing methods obtained in two ways are introduced.

1. For the JSON string returned by the server, if the jquery asynchronous request does not specify the type, or accepts it in the form of a string, then it needs to be objectified. The method is not too troublesome, that is, convert the string Put it in eval() and execute it once. This method is also suitable for obtaining json objects in the ordinary javascript method. The following example illustrates:

var dataObj=eval("(" data ")");//Convert to json object
alert(dataObj. root.length);//Output the number of child objects of root
$.each(dataObj.root,fucntion(idx,item){
if(idx==0){
return true;
}

//Output the name and value of each root sub-object
alert("name:" item.name ",value:" item.value);
})

Note: For general js to generate json objects, you only need to replace the $.each() method with a for statement, and the others remain unchanged.

2. For the JSON string returned by the server, if the jquery asynchronous request sets the type (usually this configuration attribute) to "json", or uses the $.getJSON() method to obtain the server return, then it will not The eval() method is needed, because the result obtained at this time is already a json object. You only need to call the object directly. Here, the $.getJSON method is used as an example to illustrate the data processing method:

$.getJSON ("http://gaoyusi.blog.163.com/",{param:"gaoyusi"},function(data){
//The data returned here is already a json object
//Others below The operation is the same as the first case
$.each(data.root,function(idx,item){
if(idx==0){
return true;//Same as countinue, return false the same as break
}

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

});
});

What needs special attention here is that the eval() method in method 1 dynamically executes the string (possibly a js script), which can easily cause system security issues. Therefore, you can use some third-party client script libraries that circumvent eval(). For example, JSON in JavaScript provides a script library of no more than 3k.
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn