Markdown 表格生成器
【摘要】 作品简介:将 CSV、TSV 或竖线数据转换为 Markdown 表格,支持表头与对齐Markdown 表格生成器(Markdown Table Generator)把 CSV、TSV 或竖线分隔的数据快速转换为对齐规范的 Markdown 表格。纯 HTML/CSS/JavaScript 单文件实现,零依赖、零后端,所有处理在浏览器本地完成。功能特性自动识别分隔符:优先识别 Tab,其次竖...

Markdown 表格生成器(Markdown Table Generator)
把 CSV、TSV 或竖线分隔的数据快速转换为对齐规范的 Markdown 表格。纯 HTML/CSS/JavaScript 单文件实现,零依赖、零后端,所有处理在浏览器本地完成。
功能特性
- 自动识别分隔符:优先识别 Tab,其次竖线
|,最后逗号,,也可手动指定
- 表头开关:勾选首行作为表头并自动生成分隔行,取消则以空行占位
- 三种对齐方式:左对齐
:---、居中:---:、右对齐---:,或使用默认---
- 单元格清理:可选去除每个单元格首尾空白
- 列数自动对齐:行列数不一致时自动补齐,避免表格结构错乱
- 竖线转义:单元格内的
|自动转义为\|,不会破坏表格
- 实时输出:输入即生成 Markdown,并同步渲染表格预览
- 一键复制:复制生成的 Markdown 源码
处理流程
原始文本
→ 按行切分,跳过空行
→ 按分隔符 splitLine(竖线模式自动去掉首尾空单元格)
→ parseTable 得到二维数组
→ toMarkdown 序列化
转义单元格中的竖线
补齐列数
生成表头行与对齐分隔行
→ Markdown 文本 + 表格预览
示例
输入(逗号分隔):
姓名,年龄,城市
张三,20,北京
李四,31,上海
王五,28,广州
输出(居中,首行作表头):
| 姓名 | 年龄 | 城市 |
| :---: | :---: | :---: |
| 张三 | 20 | 北京 |
| 李四 | 31 | 上海 |
| 王五 | 28 | 广州 |
输入竖线分隔且带首尾竖线时同样可用:
| a | b |
| c | d |
使用场景
- 文档写作:把表格数据快速转成 Markdown,粘贴进 README、Wiki、博客
- 数据整理:把 Excel 复制的 TSV 或 CSV 片段转为可读表格
- 接口文档:批量生成参数说明表格
- 教学演示:演示 Markdown 表格对齐语法
快速开始
无需安装与构建,直接用浏览器打开 index.html 即可使用,或在任意静态服务器下访问:
python3 -m http.server 8037
# 访问 http://localhost:8037/index.html
技术栈
- HTML5 + CSS3 + 原生 JavaScript(零第三方依赖)
- 核心函数:
detectDelim、splitLine、parseTable、toMarkdown,统一入口convert(text, options)
- 剪贴板:
navigator.clipboard.writeText
【声明】本内容来自华为云开发者社区博主,不代表华为云及华为云开发者社区的观点和立场。转载时必须标注文章的来源(华为云社区)、文章链接、文章作者等基本信息,否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱:
cloudbbs@huaweicloud.com
- 点赞
- 收藏
- 关注作者
评论(0)