港服(Server.HK)JSON教程:JavaScript解析json格式数据简单示例

本文通过for循环来获取json结点数据,需要的朋友可以参考以下这串json数据用来存储预加载的图片路径: 代码如下: …

本文通过for循环来获取json结点数据,需要的朋友可以参考以下这串json数据用来存储预加载的图片路径:

代码如下:

var imgData = [{
        name: "p1",
        src: "images/p1.jpg"
    }, {
        name: "p2",
        src: "images/p2.jpg"
    }, {
        name: "p3",
        src: "images/p3.jpg"
    }, {
        name: "p4",
        src: "images/p4.jpg"
    }, {
        name: "p5",
        src: "images/p5.jpg"
    }
]

下面这个函数可通过json每行的name来获取该行的路径src,让我们看一下代码:

代码如下:

function getData(name) {
    var picArr = imgData;
    var picSrc;
    for (var i = 0; i < picArr.length; i++) {
        var cur_person = picArr[i];
        if (cur_person.name == name) {
            picSrc = cur_person.src;
        }
    }
    return picSrc;
}

函数执行后将返回该行的src。

代码如下:

var g = getData("p1");
console.log(g);

输出后即可看到结果为:images/p1.jpg

JS对象与JSON格式数据相互转换

JS对象和JSON格式数据的相互转换其实就是两个问题:JS对象转换成为JSON格式数据、JSON格式数据转换成为JS对象。目前的项目数据交互几乎都用JQuery,所以处理流程是:前端页面数据-》JS对象-》jQuery提交-》python处理,另外一种就是倒过来。python肯定不能直接处理JS对象数据,所以要把JS对象转换成为python能处理的一种数据格式(通常是字典dict),同样,python取数据反馈到前端也要把字典数据转换成JS能处理的对象,这个中间转换数据格式通常就是JSON。 

一、JS对象转换成为JSON 

流程:读取前端页面数据,组装成为JS对象,并通过jQuery的$.post()方法传递给python。 

处理:引用一个json2.js文件,调用JSON.stringify()方法。例如:

var data = new Object(); 
var json_data = JSON.stringify(data); 

读取:python这里就很简单了,用dict_data = json.loads(json_data)就OK了 

二、JSON转换成为JS 

流程:python组装一个dict数据并转成JSON格式传递给前端,或者前端通过jQuery的$.getJSON()方法直接读取这个JSON格式的数据 
处理:用jQuery的一个方法$.parseJSON()将JSON格式的数据转成JS对象。例如:

var json_data = $.getJSON(); 
var data = $.parseJSON(json_data); 

读取:JS对像的操作就不必多说了 
这里,python要把字典转换成JSON格式数据,用json.dumps()这个方法就行了 

为您推荐

港服(Server.HK)Angular教程:Angular 编译器选项

Angular 编译器选项 使用 AoT 编译 时,可以通过在 Typ...

港服(Server.HK)Vue CLI教程:Vue CLI 快速原型开发

你可以使用 vue serve 和 vue build 命令对单个 *...

港服(Server.HK)SASS教程:7. 小结

本文介绍了sass最基本部分,你可以轻松地使用sass编写清晰、无冗余、语义化的css。对于sass提供的工具你已经有了...

港服(Server.HK)JSON教程:解析javascript 数组(以及json元素的添加删除)

javasscript删除数组的3种方法 1、用shift()方法 shift:删除原数组第一项,并返回删除元素的值;如...

港服(Server.HK)JSON教程:在 Perl 中使用 JSON

本教程将会教我们如何使用 Perl 编程语言编码和解码 JSON 对象。让我们先来准备环境以便针对 JSON 进行 Pe...
返回顶部