关于 JSON 树形查看器
面对一大段嵌套很深的 JSON,纯文本很难看清层级关系。本工具左侧是带语法高亮的代码编辑器,右侧把 JSON 渲染成可折叠的树形结构:支持树内关键字搜索与高亮跳转、点击节点一键复制其 JSONPath 路径、内联显示数组长度与对象键数,并提供 Tree / 源码 / 表格三种视图切换。采用虚拟滚动技术,超大 JSON 树也不卡顿。所有处理均在浏览器本地完成,无需安装任何软件,它适合调试接口响应、审阅第三方返回的深层结构或在大 JSON 里定位某个字段。例如粘贴一段深层嵌套 JSON 会以可折叠树展示,并高亮类型颜色,支持搜索定位字段。定位字段时先搜索关键词再逐级展开,比手工数括号高效得多;复制出的路径可直接用于代码取值,审阅第三方返回结构时先看清数组与对象的嵌套层级,能减少联调时的沟通往返。
使用方法
- 打开「JSON 树形查看器」
- 输入或粘贴待处理的内容
- 根据需要调整输出选项
- 点击「运行」按钮,结果实时显示
- 复制或导出结果
使用场景
- 浏览接口数据 — 把接口返回的复杂 JSON 渲染成树,逐层展开查看你关心的字段。
- 搜索定位字段 — 输入关键字即可高亮所有匹配的键或值,并用上下箭头在结果间跳转。
- 复制节点路径 — 点击任意节点一键复制其 JSONPath(如 $.config.theme),直接用于代码或查询。
- 表格查看数组 — 对象数组可切换为表格视图,像看 Excel 一样对比每行数据。
- 检查大数据规模 — 虚拟滚动让数万节点的超大 JSON 也能流畅展开浏览,不冻结页面。
常见问题
能处理多大的 JSON?
得益于虚拟滚动,树视图只渲染可视区域的节点,数 MB、数万节点的 JSON 也能流畅展开,不会卡死页面。
怎么搜索树里的内容?
在搜索栏输入关键字,所有匹配的键或值会高亮,并显示命中数量,用 ↑/↓ 或回车在匹配项之间跳转。
怎么复制某个节点的路径?
把鼠标移到节点上会显示其 JSONPath,点击叶子节点即可复制路径(如 $.users[0].name),方便用于 JSONPath 查询或代码取值。
表格视图什么时候可用?
当根数据是对象数组(每个元素都是对象)时,可切换到表格视图,自动以字段并集作为列头。
和格式化工具有什么区别?
「JSON 格式化」输出带缩进的文本并支持编辑,本工具侧重交互式浏览:折叠树、搜索、路径复制与多视图,更适合理解超大或超深的 JSON。
展开几百层的深层 JSON 会卡顿吗?
不会。树视图用虚拟滚动只渲染可视区域内的节点,默认也会把深层大对象折叠起来,因此即便展开数万节点也保持流畅。若某次搜索跨大量命中,建议用精确匹配开关缩小范围,再逐级展开定位。
为什么有些键显示灰色、有些显示不同颜色?
颜色是 JSON 类型高亮:字符串、数字、布尔值、null 和键名各对应一种颜色(如字符串绿色、数字蓝色),红色常表示无效或错误节点。你可在设置里调整配色,也可关掉高亮只看纯文本。