ホームページ >ウェブフロントエンド >jsチュートリアル >jquery JSON解析方法の例 Introduction_jquery

jquery JSON解析方法の例 Introduction_jquery

WBOY
WBOYオリジナル
2016-05-16 16:41:111078ブラウズ

ここで考慮されるのは、サーバーが JSONObject などのプラグインによってカプセル化された 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オブジェクトと文字列に基づいて、2つの方法で取得した結果の処理方法を紹介します。

1. サーバーから返される JSON 文字列について、jquery 非同期リクエストに型の説明がない場合、または文字列として受け入れられる場合、メソッドはそれほど面倒ではありません。 eval()に文字列を入れると1回実行されます。このメソッドは、通常の 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 ステートメントに置き換えるだけで済み、その他は変更されません。

2. サーバーから返される JSON 文字列の場合、jquery 非同期リクエストがタイプ (通常はこの構成属性) を「json」に設定するか、$.getJSON() メソッドを使用してサーバーからの戻り値を取得する場合、 eval() メソッドを使用する必要はありません。この時点で取得される結果はすでに json オブジェクトであるため、オブジェクトを直接呼び出すだけで済みます。ここでは、データ処理メソッドを説明するための例として $.getJSON メソッドが使用されています。

$.getJSON("http://gaoyusi.blog.163.com/",{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); 

}); 
});
声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。