jquery解析JSONデータ例コード


ここでは、JSONデータをjqueryで解析する方法で、jquery非同期要求の伝達対象として、jqueryが要求した後に戻る結果はJSONオブジェクトです。ここで考えているのは、JSONObjectなどのプラグインを用いてカプセル化されたJSONオブジェクトです。これと同じ大同小異です。ここでは説明をしません。ここではまずJSON文字列セットを提供します。文字列セットは以下の通りです。コードはここでjquery非同期で取得したデータタイプ――jsonオブジェクトと文字列に基づいて、それぞれ2つの方法で取得した結果処理方法を紹介します。1.サーバから返されたJSON文字列について、jqueryが例外的にタイプ説明をしていない場合、または文字列で受け付けている場合、対象化処理を行う必要があります。方式はあまり面倒ではなく、この文字列をeval()に置いて一回実行します。このような方法は、一般的なjavascipt方式で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:' '}
]
}";
注:一般的なjsに対してjsonオブジェクトを生成するには、$each()メソッドをfor文に置き換えればよく、他の変更はありません。2.サーバから返されたJSON文字列について、jqueryがtype(一般的にはこの設定属性)を「json」に設定したり、$getJSON()方法でサーバから戻りますと、eval()方法は必要ありません。このとき得られた結果はすでに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スクリプト)を動的に実行する方法である。したがって、いくつかのeval()を回避する第三者クライアントスクリプトライブラリを採用することができ、例えばJSON in JavaScriptは3 kを超えないスクリプトライブラリを提供する。