llliiiuuukkkeee-CSDN博客

原创从零实现一个在线 JSON Diff 对比工具｜100个小工具第4个

大家好！今天继续为大家分享"100个前端小工具"系列的第4个工具——在线JSON Diff对比工具。这个工具专为开发者设计，能够快速比较两个JSON对象的差异，高亮显示新增、删除和修改的字段，特别适合接口调试和数据核查。

2026-04-22 17:06:38 531

原创用原生 HTML + CSS + JS 实现一个专业级 PCB 微带线阻抗计算器

最近用纯前端技术实现了一个微带线特征阻抗在线计算器，不依赖任何前端框架，不需要后端服务，一个 HTML 文件搞定所有功能。本文重点分享技术实现思路，包括 CSS 设计系统、SVG 绘图、计算逻辑封装、LocalStorage 历史记录等。功能点实现方式代码量页面布局~20 行 HTML视觉效果CSS Variables + 伪元素渐变~80 行 CSS截面示意图内联 SVG + defs marker~30 行 SVG阻抗计算纯函数，ES6 Math~25 行 JS结果渲染。

2026-04-21 14:41:17 789

原创 100个小工具挑战 #002 | 做了个能直接编辑树形视图的 JSON 格式化工具

这篇文章介绍了一个自制的JSON格式化工具，具有以下核心特点：创新交互设计：实现了左右分屏实时联动，右侧树形视图支持直接编辑键名和值，可添加/删除节点，所有修改实时同步到左侧文本编辑器。核心功能：实时语法验证和错误提示支持格式化/压缩JSON 提供转义/反转义功能树形视图支持折叠展开和深度编辑技术实现：原生JavaScript开发，无框架依赖递归渲染处理复杂JSON结构双向同步机制维护数据一致性路径定位系统实现深层节点更新防抖优化提升大型JSON处理性能该工具解决了传统JSON编辑器

2026-04-16 17:36:38 364

原创纯前端实现发票二维码批量识别——PDF.js + jsQR 实战

本文介绍了一种纯前端实现的电子发票批量识别方案，使用PDF.js提取PDF文字层，jsQR识别二维码，Tesseract.js进行OCR处理。该方案完全在浏览器端运行，无需上传文件，保障数据隐私安全。核心流程包括：通过PDF.js直接提取发票文字内容，jsQR扫描二维码获取关键信息，针对不同发票格式采用多种正则策略提取结构化字段，对图片发票则使用Tesseract.js进行OCR识别。实测显示，该方案对电子发票PDF识别准确率高，图片发票因OCR精度问题偶有误差。最终识别结果可导出CSV格式，支持Excel

2026-04-14 14:51:34 481

优化修复版在线工具箱系统源码-带后台版本-含上百款工具\自适应模板

该工具箱系统源码基于Thinkphp内核开发，含上百款工具，带后台版本。自适应模板，优化修复版。我搭建看了一下，系统一切正常可用，后台登录方式这一块使用的是QQ扫码登录的，不喜欢的可以自己改一下。此工具箱系统源码还是比较成熟的，虽然没有那么花里胡哨，但贵在简洁大方，全工具都可以在线运行使用，且源码全针对SEO还是非常友好的，有能力的可以自行添加一些工具。安装教程： 1、先准备两个域名，一个做前台用一个做后台用的，二级域名也可以，例如：前台用 tool.baidu.com 后台用 admin.baidu.com 2、无需数据库安装环境 Nginx+php7.4 3、下载源码解压至网站根目录下，设置域名运行目录设置 /public，设置伪静态规则为 thinkphp 4、配置域名文件路径 /route/route.php 设置你自己的前台跟后台域名 5、配置后台管理员账号文件路径 /config/admin.php 设置后台登录 QQ 号

2024-01-12

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

原创 从零实现一个在线 JSON Diff 对比工具｜100个小工具第4个

原创 用原生 HTML + CSS + JS 实现一个专业级 PCB 微带线阻抗计算器