Rumah > hujung hadapan web > tutorial js > Penjelasan terperinci jQuery menghuraikan Json examples_jquery

Penjelasan terperinci jQuery menghuraikan Json examples_jquery

PHP中文网
Lepaskan: 2016-05-16 15:30:22
asal
1099 orang telah melayarinya

Contoh dalam artikel ini menerangkan cara jQuery menghuraikan Json. Kongsikan dengan semua orang untuk rujukan anda, butirannya adalah seperti berikut:

Kata Pengantar

Dalam proses penghantaran data WEB, json dihantar dalam bentuk teks, iaitu, bentuk rentetan yang ringan, dan pelanggan biasanya menggunakan JS untuk beroperasi pada objek JSON yang diterima, jadi kuncinya ialah penukaran antara objek JSON dan rentetan JSON dan penghuraian data JSON.

Pertama-tama jelaskan 2 konsep Contohnya:

rentetan JSON:

Salin kod Kod adalah sebagai berikut:

var str1 = '{ "name": "deyuyi", "sex": "man" }';
Salin selepas log masuk

Objek JSON:

Salin kod Kod adalah seperti berikut:

var str2 = { "name": "deluyi", "sex": "man" };
Salin selepas log masuk

Ia boleh difahami dengan mudah seperti ini :

Objek JSON ialah format yang boleh dikendalikan secara langsung oleh JQuery, sama seperti dalam C# anda boleh menggunakan objek (nama kelas) untuk menunjukkan atribut ( kaedah);

Rentetan JSON hanyalah rentetan, satu keseluruhan Tanpa pemintasan, tidak ada cara untuk mendapatkan semula data yang disimpan di dalamnya melainkan anda hanya mahu memaklumkannya

1. Tukar rentetan JSON kepada objek JSON

Untuk menggunakan str1 di atas, anda mesti menggunakan kaedah berikut untuk menukarnya menjadi objek JSON terlebih dahulu:

J: fungsi eval

Fungsi eval boleh secara langsung menukar rentetan yang pada asasnya mematuhi atau lebih kurang mematuhi format JSON ke dalam objek JSON, menggunakan kaedah seperti:

eval('(' str ')'); //di mana str ialah rentetan yang memenuhi huraian tajuk ini


//由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);
Salin selepas log masuk


Di atas akan mengeluarkan hasil "john".

Kaedah Eval boleh menukar rentetan format standard dan bukan standard berikut:


var str="{ 'name': 'John' }";
var str2='{ "name": "John" }';
var str3="{ name: 'John' }";
Salin selepas log masuk


Lihat contoh ini muat turun Dalam pakej: JqueryDemo1.html

B: fungsi parseJSON

Fungsi lain yang menukar rentetan standard kepada objek JSON ialah parseJSON(), digunakan seperti jQuery .parseJSON( str)//di mana str ialah rentetan yang memenuhi huraian tajuk ini


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


Keputusan di atas akan dikeluarkan. "john".

Kaedah ini hanya menyokong format standard: var str='{ "name": "John" }';

Lihat pakej muat turun untuk contoh ini: JqueryDemo2.html

C: JSON.parse function

Terdapat juga fungsi yang menukar rentetan standard kepada objek JSON ialah JSON.parse(), yang boleh digunakan sebagai JSON.parse(str) // Di mana str ialah rentetan yang memenuhi huraian tajuk ini


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


Semua di atas akan mengeluarkan hasil " john".

Kaedah ini hanya menyokong format standard: var str='{ "name": "John" }';

Lihat pakej muat turun untuk contoh ini: JqueryDemo3.html

Keputusan di atas adalah konsisten dan semua nama adalah output, seperti yang ditunjukkan di bawah:

Nota khas: Jika obj pada asalnya objek JSON, gunakan eval () fungsi Selepas penukaran (walaupun berbilang penukaran), ia masih merupakan objek JSON, tetapi akan ada masalah (melemparkan pengecualian sintaks) selepas menggunakan fungsi parseJSON().

D: Kaedah lain

Jika anda tidak boleh membantu tetapi ingin membuat kesilapan, anda benar-benar ingin menghuraikan rentetan yang tidak standard dan tidak teratur, seperti:


Salin kod Kod adalah seperti berikut:

{name:mady,age:23}
Salin selepas log masuk
atau


Salin kod Kodnya adalah seperti berikut:

{name:'mady',age:23}
Salin selepas log masuk
dan format haram lain yang pada asasnya betul yang anda boleh fikirkan, kemudian terdapat perpustakaan sambungan yang boleh menyelesaikannya


jquery-json Pustaka sambungan

Alamat muat turun ada di sini:

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

Pustaka ini digunakan untuk melanjutkan jQuery , untuk penggunaan JSON, dua fungsi telah dilanjutkan: toJSON dan parseJSON

fungsi toJSON digunakan untuk mensirikan objek JavaScript biasa ke dalam JSON objek.

Fungsi parseJSON digunakan untuk menyerikan objek JavaScript biasa ke dalam objek JSON juga.


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);
Salin selepas log masuk


Hasil pelaksanaan kod di atas adalah seperti berikut:

Lihat pakej muat turun untuk contoh ini: JqueryDemo5.html

2. Tukar objek JSON kepada rentetan

Anda boleh menggunakan toJSONString() atau kaedah global JSON.stringify( ) Menukar objek JSON kepada rentetan JSON.

Contohnya:

Salin kod Kod adalah seperti berikut:

var last=obj.toJSONString(); //将JSON对象转化为JSON字符
Salin selepas log masuk
atau



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


三、解析读取JSON

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

复制代码 代码如下:

var str2 = { "name": "mady", "sex": "man" };
Salin selepas log masuk

就可以这样读取:

复制代码 代码如下:

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

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

复制代码 代码如下:

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

解析用:

      alert(str.GetUserPostByIdResult.Name);//一次点不出来,我多点几次
Salin selepas log masuk

再再复杂一点的如:

复制代码 代码如下:

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


如果你想单挑的话,解析用:

复制代码 代码如下:

alert(dataObj.root[0].name);
Salin selepas log masuk

弹出:“6200”。

如果你想群挑的话,解析用:


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


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

 

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

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

以上就是jQuery解析Json实例详解_jquery的内容,更多相关内容请关注PHP中文网(m.sbmmt.com)!


Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan