JSON 数据转 HTML 表格 - 嵌套折叠与排序
将 JSON 数组或对象渲染为可交互的 HTML 表格,支持嵌套展开、列排序和搜索。
UD5工具箱
深度比较两个JSON,高亮新增、删除、修改的节点
id、key等唯一标识字段,建议排序后再对比以获得更准确的差异结果。{"a":1,});② 缺少引号——键名未使用双引号包裹(如{name:"John"}应为{"name":"John"});③ 使用了单引号——JSON标准只允许双引号;④ 注释——JSON不支持//或/* */注释。您可以点击"格式化"按钮自动检测并提示具体错误位置。将 JSON 数组或对象渲染为可交互的 HTML 表格,支持嵌套展开、列排序和搜索。
在浏览器中即时测试for、forEach、map、for-of等循环的执行速度,帮助选择最优写法。
加载Lottie动画JSON文件,播放并控制速度、方向,预览动效效果。
粘贴JSON对象,生成可折叠的树形视图,点击节点复制其键值路径,方便调试。
粘贴PHP print_r或var_export输出,智能解析为有效的JSON。
粘贴HTML并编写XPath表达式,高亮显示匹配的节点并提取文本。
粘贴结构化数据代码,模拟Google结构化数据测试,检查错误与丰富结果。
输入 HTML 或网址,提取所有标题标签,生成文档大纲树,检测跳跃和缺失。
粘贴统一diff格式文本,以并排或行内方式高亮显示代码的增减修改。
并列播放所有CSS内置缓动函数(ease, linear等)的动画效果,方便对比选择。
为图片添加类似胶片漏光的红黄色调渐变或光晕效果,营造怀旧氛围。
粘贴带参数的URL,以表格形式列出所有Query参数与值。
拖拽基色指针,自动计算互补、近似、三等分等七种和谐配色方案,复制十六进制值。
为页面上使用CSS Grid的元素显示网格线和名称,辅助布局开发和调试。
编写带有伪类的选择器,实时高亮匹配的HTML元素,探索现代CSS选择器的能力。
提取HTML中内联style属性或嵌入式style标签,转变为独立CSS规则,辅助样式重构。
在线正则表达式测试工具,支持JavaScript正则匹配、替换、提取等操作,即时显示匹配结果和高亮。
提取HTML中所有内嵌 `<style>` 标签的内容,合并生成单独CSS文件。
输入文本,滑块调节letter-spacing和word-spacing,实时显示效果并复制CSS。
生成具有扫描线、荧光拖影和屏幕弯曲效果的纯CSS复古电脑终端样式。
构建 Promise 链并显示每个 then/catch 的执行时间与状态,帮助理解微任务调度。
输入标题文本,尝试不同容器宽度,手动插入<br>或使用text-wrap:balance显示效果。
勾选需要展示的选项(接受/拒绝/设置),生成纯净HTML/JS代码,自行套用样式。
为内容区域生成灰色闪烁的骨架屏占位代码,包含卡片、标题等组件样式。
在可视化环境中编写JSONPath或JMESPath表达式,实时高亮匹配结果并查看路径提取逻辑。
在页面上叠加可拖拽的半透明网格线,辅助网格布局对齐。
选择触发位置、箭头方向与样式,生成轻量悬停提示框代码。
上传 webpack 的 stats.json,生成交互式树状图、模块大小排名,辅助优化构建体积。
粘贴网页上的 HTML 表格代码,自动提取数据并转换为 JSON 或 CSV 格式下载。
显示文本中的非换行空格、全角空格等隐藏字符映射。