feat: 增加对 HTML 标签的支持,扩展 BBCode 转换规则

This commit is contained in:
catlog22
2026-01-13 16:58:24 +08:00
parent 94ae9e264c
commit 08308aa9ea
4 changed files with 63 additions and 14 deletions

View File

@@ -43,14 +43,25 @@ Transform and optimize text content with intelligent structure analysis. Output
| Tag | Usage | Example |
|-----|-------|---------|
| `[size=N]` | Font size (pixels) | `[size=120]Title[/size]` |
| `[color=X]` | Text color | `[color=#2196F3]Blue[/color]` |
| `[color=X]` | Text color (hex/name) | `[color=#2196F3]Blue[/color]``[color=blue]` |
| `[b]` | Bold | `[b]Bold text[/b]` |
| `[i]` | Italic | `[i]Italic[/i]` |
| `[s]` | Strikethrough | `[s]deleted[/s]` |
| `[u]` | Underline | `[u]underlined[/u]` |
| `[quote]` | Quote block | `[quote]Content[/quote]` |
| `[code]` | Code block | `[code]code[/code]` |
| `[img]` | Image | `[img]url[/img]` |
| `[url]` | Link | `[url=link]text[/url]` |
| `[list]` | List container | `[list][*]item[/list]` |
| `[spoiler]` | Collapsible content | `[spoiler=标题]隐藏内容[/spoiler]` |
### HTML to BBCode Conversion
| HTML Input | BBCode Output |
|------------|---------------|
| `<mark>高亮</mark>` | `[color=yellow]高亮[/color]` |
| `<u>下划线</u>` | `[u]下划线[/u]` |
| `<details><summary>标题</summary>内容</details>` | `[spoiler=标题]内容[/spoiler]` |
### Unsupported Tags (Avoid!)

View File

@@ -144,10 +144,18 @@ function formatBBCodeMD(text) {
// ===== 文本样式 =====
result = result.replace(/\*\*\*(.+?)\*\*\*/g, '[b][i]$1[/i][/b]');
result = result.replace(/\*\*(.+?)\*\*/g, '[b]$1[/b]');
result = result.replace(/__(.+?)__/g, '[b]$1[/b]');
result = result.replace(/\*(.+?)\*/g, '[i]$1[/i]');
result = result.replace(/_(.+?)_/g, '[i]$1[/i]');
result = result.replace(/~~(.+?)~~/g, '[s]$1[/s]');
result = result.replace(/==(.+?)==/g, '[color=yellow]$1[/color]');
// ===== HTML 转 BBCode =====
result = result.replace(/<mark>(.+?)<\/mark>/g, '[color=yellow]$1[/color]');
result = result.replace(/<u>(.+?)<\/u>/g, '[u]$1[/u]');
result = result.replace(/<details>\s*<summary>(.+?)<\/summary>\s*([\s\S]*?)<\/details>/g,
'[spoiler=$1]$2[/spoiler]');
// ===== 代码 =====
result = result.replace(/```(\w*)\n([\s\S]*?)```/g, '[code]$2[/code]');
// 行内代码保持原样 (部分论坛不支持 font=monospace)

View File

@@ -59,6 +59,14 @@
| 斜体 | `/\*(.+?)\*/` | `*italic*` |
| 删除线 | `/~~(.+?)~~/` | `~~strike~~` |
### HTML 元素检测
| 类型 | Pattern | 示例 |
|------|---------|------|
| 高亮 | `/<mark>(.+?)<\/mark>/` | `<mark>高亮</mark>` |
| 折叠块 | `/<details>\s*<summary>(.+?)<\/summary>([\s\S]*?)<\/details>/` | `<details><summary>标题</summary>内容</details>` |
| 下划线 | `/<u>(.+?)<\/u>/` | `<u>下划线</u>` |
---
## Element Conversion Matrix
@@ -76,15 +84,24 @@
### 文本样式映射
| Element | Markdown | BBCode |
|---------|----------|--------|
| **Bold** | `**text**` | `[b]text[/b]` |
| **Italic** | `*text*` | `[i]text[/i]` |
| Element | Markdown/HTML | BBCode |
|---------|---------------|--------|
| **Bold** | `**text**` 或 `__text__` | `[b]text[/b]` |
| **Italic** | `*text*` 或 `_text_` | `[i]text[/i]` |
| **Bold+Italic** | `***text***` | `[b][i]text[/i][/b]` |
| **Strike** | `~~text~~` | `[s]text[/s]` |
| **Highlight** | `==text==` | `[color=yellow]text[/color]` |
| **Underline** | `<u>text</u>` | `[u]text[/u]` |
| **Highlight** | `==text==` 或 `<mark>text</mark>` | `[color=yellow]text[/color]` |
| **Code (inline)** | `` `text` `` | 保持原样 |
### HTML 转 BBCode 映射
| HTML | BBCode |
|------|--------|
| `<mark>text</mark>` | `[color=yellow]text[/color]` |
| `<u>text</u>` | `[u]text[/u]` |
| `<details><summary>标题</summary>内容</details>` | `[spoiler=标题]内容[/spoiler]` |
### 块级元素映射
| Element | Markdown | BBCode |

View File

@@ -28,18 +28,23 @@ BBCode + Markdown 混合格式转换规则(论坛优化)。
**支持的 BBCode 标签**:
- `[size=N]` - 字号(像素值)
- `[color=X]` - 颜色hex 或名称)
- `[b]`, `[i]`, `[s]` - 粗体、斜体、删除线
- `[color=X]` - 颜色hex 或名称,如 `[color=blue]``[color=#2196F3]`
- `[b]`, `[i]`, `[s]`, `[u]` - 粗体、斜体、删除线、下划线
- `[quote]` - 引用块
- `[code]` - 代码块
- `[url]`, `[img]` - 链接、图片
- `[list]`, `[*]` - 列表
- `[spoiler]``[spoiler=标题]` - 折叠/隐藏内容
**禁止使用的标签**:
- `[align]` - 不渲染,显示为文本
- `[hr]` - 不渲染,使用 Markdown `---`
- `[table]` - 支持有限,避免使用
- HTML 标签 (`<div>`, `<span>`) - 不支持
**HTML 标签转换** (输入时支持,转换为 BBCode):
- `<mark>text</mark>``[color=yellow]text[/color]`
- `<details><summary>标题</summary>内容</details>``[spoiler=标题]内容[/spoiler]`
- 其他 HTML 标签 (`<div>`, `<span>`) - 删除
### 3. Markdown as Separator
@@ -60,13 +65,21 @@ BBCode + Markdown 混合格式转换规则(论坛优化)。
### 文本样式
| Markdown | BBCode |
|----------|--------|
| `**bold**` | `[b]bold[/b]` |
| `*italic*` | `[i]italic[/i]` |
| Markdown/HTML | BBCode |
|---------------|--------|
| `**bold**``__bold__` | `[b]bold[/b]` |
| `*italic*``_italic_` | `[i]italic[/i]` |
| `***both***` | `[b][i]both[/i][/b]` |
| `~~strike~~` | `[s]strike[/s]` |
| `==highlight==` | `[color=yellow]highlight[/color]` |
| `==highlight==``<mark>text</mark>` | `[color=yellow]highlight[/color]` |
| (无 MD 语法) | `[u]underline[/u]` |
### 折叠内容
| HTML | BBCode |
|------|--------|
| `<details><summary>标题</summary>内容</details>` | `[spoiler=标题]内容[/spoiler]` |
| (无 HTML) | `[spoiler]隐藏内容[/spoiler]` |
### 代码