使用js获取json数据title

于 2024-04-03 15:26:18 发布
阅读量438 收藏
点赞数 14
文章标签： javascript json 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/kuang_nu/article/details/137347125
版权

问:

[
    {
        "id": 1,
        "pid": 0,
        "sourceId": 100300264,
        "sourcePid": 0,
        "title": "图片",
        "status": 2,
        "iconUrl": "",
        "ranking": 9,
        "isAutoCapture": 1,
        "updateFlag": 0,
        "showType": 1,
        "images": "",
        "children": [
            {
                "id": 12,
                "pid": 1,
                "sourceId": 100342142,
                "sourcePid": 100300264,
                "title": "图片2011",
                "status": 2,
                "iconUrl": "",
                "ranking": 1,
                "isAutoCapture": 1,
                "updateFlag": 0,
                "children": []
            },
            {
                "id": 13,
                "pid": 1,
                "sourceId": 100329097,
                "sourcePid": 100300264,
                "title": "一周新闻人物",
                "status": 2,
                "iconUrl": "",
                "ranking": 2,
                "isAutoCapture": 1,
                "updateFlag": 0,
                "children": []
            },
            {
                "id": 14,
                "pid": 1,
                "sourceId": 100320337,
                "sourcePid": 100300264,
                "title": "图记",
                "status": 2,
                "iconUrl": "",
                "ranking": 3,
                "isAutoCapture": 1,
                "updateFlag": 0,
                "children": []
            }
        ]
    },
    {
        "id": 2,
        "pid": 0,
        "sourceId": 100300263,
        "sourcePid": 0,
        "title": "视频",
        "status": 2,
        "iconUrl": "",
        "ranking": 11,
        "isAutoCapture": 1,
        "updateFlag": 0,
        "showType": 1,
        "images": "",
        "children": [
            {
                "id": 27,
                "pid": 2,
                "sourceId": 100221702,
                "sourcePid": 100300263,
                "title": "xxxx",
                "status": 2,
                "iconUrl": "",
                "ranking": 1,
                "isAutoCapture": 1,
                "updateFlag": 0,
                "children": []
            },
            {
                "id": 29,
                "pid": 2,
                "sourceId": 100180108,
                "sourcePid": 100300263,
                "title": "合作专区",
                "status": 2,
                "iconUrl": "",
                "ranking": 3,
                "isAutoCapture": 1,
                "updateFlag": 0,
                "children": []
            },
            {
                "id": 30,
                "pid": 2,
                "sourceId": 100179202,
                "sourcePid": 100300263,
                "title": "实时报道",
                "status": 2,
                "iconUrl": "",
                "ranking": 4,
                "isAutoCapture": 1,
                "updateFlag": 0,
                "children": []
            },
            {
                "id": 32,
                "pid": 2,
                "sourceId": 100179177,
                "sourcePid": 100300263,
                "title": "xxxx",
                "status": 2,
                "iconUrl": "",
                "ranking": 6,
                "isAutoCapture": 1,
                "updateFlag": 0,
                "children": []
            },
        ]
    },
    {
        "id": 5,
        "pid": 0,
        "sourceId": 100300008,
        "sourcePid": 0,
        "title": "世界",
        "status": 2,
        "iconUrl": "",
        "ranking": 5,
        "isAutoCapture": 1,
        "updateFlag": 0,
        "showType": 1,
        "images": "",
        "children": [
            {
                "id": 82,
                "pid": 5,
                "sourceId": 100332007,
                "sourcePid": 100300008,
                "title": "美国大选",
                "status": 2,
                "iconUrl": "",
                "ranking": 6,
                "isAutoCapture": 1,
                "updateFlag": 0,
                "children": []
            },
            {
                "id": 83,
                "pid": 5,
                "sourceId": 100331956,
                "sourcePid": 100300008,
                "title": "欧债危机",
                "status": 2,
                "iconUrl": "",
                "ranking": 5,
                "isAutoCapture": 1,
                "updateFlag": 0,
                "children": []
            },
            {
                "id": 84,
                "pid": 5,
                "sourceId": 100331928,
                "sourcePid": 100300008,
                "title": "MarketWatch",
                "status": 2,
                "iconUrl": "",
                "ranking": 3,
                "isAutoCapture": 1,
                "updateFlag": 0,
                "children": []
            },
            {
                "id": 85,
                "pid": 5,
                "sourceId": 100318194,
                "sourcePid": 100300008,
                "title": "世界快讯",
                "status": 2,
                "iconUrl": "",
                "ranking": 8,
                "isAutoCapture": 1,
                "updateFlag": 0,
                "children": []
            },
        ]
    },
    {
        "id": 6,
        "pid": 0,
        "sourceId": 100300007,
        "sourcePid": 0,
        "title": "政经",
        "status": 2,
        "iconUrl": "",
        "ranking": 4,
        "isAutoCapture": 1,
        "updateFlag": 0,
        "showType": 1,
        "images": "",
        "children": [
            {
                "id": 93,
                "pid": 6,
                "sourceId": 100318661,
                "sourcePid": 100300007,
                "title": "政经快讯",
                "status": 2,
                "iconUrl": "",
                "ranking": 4,
                "isAutoCapture": 1,
                "updateFlag": 0,
                "children": []
            },
            {
                "id": 95,
                "pid": 6,
                "sourceId": 100309443,
                "sourcePid": 100300007,
                "title": "政经评论",
                "status": 2,
                "iconUrl": "",
                "ranking": 3,
                "isAutoCapture": 1,
                "updateFlag": 0,
                "children": []
            },
            {
                "id": 98,
                "pid": 6,
                "sourceId": 100300241,
                "sourcePid": 100300007,
                "title": "政经新闻",
                "status": 2,
                "iconUrl": "",
                "ranking": 1,
                "isAutoCapture": 1,
                "updateFlag": 0,
                "children": []
            },
            {
                "id": 100,
                "pid": 6,
                "sourceId": 100300190,
                "sourcePid": 100300007,
                "title": "xxxx",
                "status": 2,
                "iconUrl": "",
                "ranking": 2,
                "isAutoCapture": 1,
                "updateFlag": 0,
                "children": []
            },
            {
                "id": 231,
                "pid": 6,
                "sourceId": 101155570,
                "sourcePid": 0,
                "title": "特报",
                "status": 2,
                "iconUrl": "",
                "ranking": 0,
                "isAutoCapture": 1,
                "updateFlag": 1,
                "showType": 2,
                "children": []
            },
            {
                "id": 248,
                "pid": 6,
                "sourceId": 100756646,
                "sourcePid": 0,
                "title": "人事观察",
                "status": 2,
                "iconUrl": "",
                "ranking": 0,
                "isAutoCapture": 1,
                "updateFlag": 1,
                "showType": 1,
                "children": []
            }
        ]
    },
    {
        "id": 7,
        "pid": 0,
        "sourceId": 100300006,
        "sourcePid": 0,
        "title": "公司",
        "status": 2,
        "iconUrl": "",
        "ranking": 3,
        "isAutoCapture": 1,
        "updateFlag": 0,
        "showType": 1,
        "images": "",
        "children": [
            {
                "id": 108,
                "pid": 7,
                "sourceId": 100318192,
                "sourcePid": 100300006,
                "title": "公司快讯",
                "status": 2,
                "iconUrl": "",
                "ranking": 5,
                "isAutoCapture": 1,
                "updateFlag": 0,
                "children": []
            },
            {
                "id": 109,
                "pid": 7,
                "sourceId": 100314102,
                "sourcePid": 100300006,
                "title": "商业评论",
                "status": 2,
                "iconUrl": "",
                "ranking": 2,
                "isAutoCapture": 1,
                "updateFlag": 0,
                "children": []
            },
            {
                "id": 113,
                "pid": 7,
                "sourceId": 100300183,
                "sourcePid": 100300006,
                "title": "商业模式",
                "status": 2,
                "iconUrl": "",
                "ranking": 4,
                "isAutoCapture": 1,
                "updateFlag": 0,
                "children": []
            },
            {
                "id": 114,
                "pid": 7,
                "sourceId": 100300182,
                "sourcePid": 100300006,
                "title": "xxxx",
                "status": 2,
                "iconUrl": "",
                "ranking": 3,
                "isAutoCapture": 1,
                "updateFlag": 0,
                "children": []
            },
        ]
    },
    {
        "id": 8,
        "pid": 0,
        "sourceId": 100300005,
        "sourcePid": 0,
        "title": "宏观",
        "status": 2,
        "iconUrl": "",
        "ranking": 1,
        "isAutoCapture": 1,
        "updateFlag": 0,
        "showType": 1,
        "images": "",
        "children": [
            {
                "id": 117,
                "pid": 8,
                "sourceId": 100318191,
                "sourcePid": 100300005,
                "title": "经济快讯",
                "status": 2,
                "iconUrl": "",
                "ranking": 4,
                "isAutoCapture": 1,
                "updateFlag": 0,
                "children": []
            },
            {
                "id": 120,
                "pid": 8,
                "sourceId": 100300269,
                "sourcePid": 100300005,
                "title": "xxxx",
                "status": 2,
                "iconUrl": "",
                "ranking": 2,
                "isAutoCapture": 1,
                "updateFlag": 0,
                "children": []
            },
            {
                "id": 121,
                "pid": 8,
                "sourceId": 100300213,
                "sourcePid": 100300005,
                "title": "天天预测",
                "status": 2,
                "iconUrl": "",
                "ranking": 3,
                "isAutoCapture": 1,
                "updateFlag": 0,
                "children": []
            },
            {
                "id": 125,
                "pid": 8,
                "sourceId": 100300184,
                "sourcePid": 100300005,
                "title": "经济新闻#|#Economy",
                "status": 2,
                "iconUrl": "",
                "ranking": 1,
                "isAutoCapture": 1,
                "updateFlag": 0,
                "children": []
            },
        ]
    }
]这段json数据我希望获取title怎么获取?第一层级的是频道的title,第二层级的是栏目的title

回答:

fury_123
关注
js读取json文件片段中的数据实例
12-01
在JavaScript中，从服务器端获取并解析JSON数据是常见的任务，尤其在动态网站中，用于显示从数据库中获取的信息。本实例将详细讲解如何利用JavaScript（搭配jQuery库）读取JSON文件片段中的数据，并将其展示在HTML...
js-json:读取 Json，用数据填充 DOM，并操作它们
06-11
在本教程中，我们将深入探讨如何使用 JavaScript 读取 JSON 数据，并将其有效地用于填充和操作 Document Object Model (DOM)。 首先，让我们了解 JSON 的基本结构。JSON 数据通常以键值对的形式存在，类似于 ...
JSON
梁什么鸭“的博客
05-03 378
JSON是什么？？(可参考JS高级程序设计第4版第703页) 一种存储数据的数据格式 可以理解为类似数组的数据格式，栗子： <script> var json = {a: 1, b: 2, c: 3}; var arr = [3, 4, 5,]; console.log(json.a); console.log(json['a']); console.log(arr[0]); </script> 运行结果： 1 ...
JS“通过下标”访问json对象中的值
Hello World !
11-01 9030
因为对象是没有顺序的，所以想要取出json对象中的值，只能通过json["key"]的方式，但是可以创建一个数组，然后将json中的值全部取到数组，就可以通过下标访问数组中的数据了： 例：var json={"A":"val1","B":"val2","C":"val3","D":"val4"};   取出A、B、C、D选项
JSON的遍历(js)
nO0b
10-17 908
今天在做前后端交互的时候需要把一个json中的数组以表格(table)的形式输出 然后就出现了标题的问题,怎么遍历JSON对象 , 经过痛苦的纠结之后发现json对象是可以像数组一样使用下标遍历的! 只不过json对象使用key值作为下标遍历的, 并且作为下标的key值是字符串形式 var j={"id":"1","name":"博通","age":"16","other
js如何获取json数据的方法总结以及在不启动服务的情况下获取数据
小多的博客
12-15 4764
可以将json文件数据写在js文件中并定义成全局变量，然后再其他js文件中使用即可。
JS读取本地json文件的方法汇总
最新发布
u012230371的博客
07-27 1万+
JavaScript 加载本地json
Javascript读取json文件
weixin_57913339的博客
04-10 2731
我们已经能够读取本地 JSON 文件。但不幸的是，当我们在浏览器中运行它时，可能会收到以下 CORS 错误，因为我们的文件不在服务器上。为了解决这个问题，我们将确保 JSON 文件位于本地或远程服务器上。如果我们在 IDE 上使用 Live 服务器，则不会出现此错误。但是当我们直接加载文件时，会得到这个错误。
html中通过JS获取JSON数据并加载的方法
10-18
在HTML页面中，我们经常需要通过JavaScript来获取JSON数据，并将其加载到页面上显示。这篇内容将详细介绍如何通过JavaScript解析JSON数据并将其加载到HTML中。 首先，HTML部分提供了一个基本的容器结构，如示例代码...
jQuery使用getJSON方法获取json数据完整示例
10-21
示例中还展示了将JSON文件存放在Web容器中时，如何通过更改后缀名来正常读取JSON数据。这里将原本的.json后缀改为.js后缀，并放在服务器上的某个目录中。由于HTTP请求通常只能访问.js、.html等静态资源文件，更改...
JS获取json文件内容并处理参考
09-14
利用jquery的post功能获取json的内容并作后续处理， 本例子需要在web环境下跑 本例子需要在web环境下跑 本例子需要在web环境下跑
JS获取JSON数据，JS JSON数据处理。
程序员
02-01 1033
以上方式获取到的数据都是 JSON 格式的数据，无需转换，即可使用。使用 getJSON 方式获取。1、Ajax获取json数据。js获取json数据的方法。
js之接收JSON
zccst的专栏
06-23 490
作者：zccst js 中读取JSON的方法探讨 js读取JSON的方法我接触到的有两种： 方法一：函数构造定义法返回 var strJSON = "{name:'json name'}";//得到的JSON var obj = new Function("return" + strJSON)();//转换后的JSON对象 alert(obj.name);//json name...
JavaScript中获取JSON文件中的数据
ZDFXN的博客
12-06 4346
https://blog.csdn.net/qq_40065776/article/details/104490792
新手如何使用JavaScript读取json文件
aLoudVoice_的博客
03-30 3万+
使用JavaScript读取json文件前言正式开始前提条件终于可以开始了全部代码 前言 最近尝试使用js读取json文件，并调用json的数据。在网上找到各种大佬写的教程，拷贝到自己电脑上就各种报错，对于新手来说不太友好。经过一个下午的时间终于搞定，这里做个记录，希望帮助到js新手，欢迎大佬批评指正~ 正式开始 前提条件 网上最多的方法就是让使用ajax读取，但是我一用浏览器就报错 查资料才知道...
Javascript——读取json文件方法总结
热门推荐
helloyangkl的博客
09-01 4万+
Javascript——读取json文件方法总结
JSON(发送/接收)
avaj的博客
09-21 1864
json 相关基础知识 json官网 json,w3c详情 js发送json串 json2.js 列表内容 相关代码 $(".sun_onclick").click(function () { var pcategory = $(this).attr("pcategory"); var orderBy = $("select[name='orderBy']").
从JSON中读取数据追加到HTML中
weixin_33850015的博客
11-29 2688
在写内容逻辑重复性的页面时，用json数据可以显著提高编程效率，并且便于后期的数据维护。因此，在视频专题页面，需要展示多列视频数据，我选择了用json。 HTML如下（只展示重点部分，需要引用JQ） <div class="container-fluid content "> <div class="co...
html读取json数据
06-08
要在 HTML 中读取 JSON 数据，可以使用 JavaScript 的 AJAX 技术。以下是一个简单的例子： ...在 JavaScript 的 `$.getJSON()` 函数中，我们通过回调函数处理了获取到的 JSON 数据，并使用循环把它们插入到表格中。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值