在AI生成内容日益普及的今天，许多用户都会遇到格式错乱、特殊符号异常、表格排版混乱等问题，尤其是在将AI生成的内容应用到正式文档中时，往往需要花费大量时间手动调整。
中间功能区按"格式修复" "内容清洗" "智能排版"三大模块分类，含修复特殊符号、修复表格格式、清除多余空格、移除所有标记、自动排版等实用功能，用户可根据需求灵活选用。
[HTML] 纯文本查看 复制代码
<!DOCTYPE html>[/p]<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>大飞哥软件自习室AI内容编辑器</title>
<style>
:root {
--primary: #3a7bd5;
--primary-light: #5b95e5;
--primary-dark: #2860b3;
--secondary: #00b42a;
--warning: #ff7d00;
--danger: #f53f3f;
--light: #f2f3f5;
--dark: #1d2129;
--gray: #86909c;
--border: #e5e6eb;
--shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
--shadow-strong: 0 8px 30px rgba(0, 0, 0, 0.12);
--radius: 12px;
--transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: 'Segoe UI', 'Microsoft YaHei', sans-serif;
}
body {
background-color: #f7f8fa;
color: var(--dark);
line-height: 1.6;
padding-bottom: 3rem;
}
/* 头部设计 */
.site-header {
background: linear-gradient(135deg, var(--primary), var(--primary-dark));
color: white;
padding: 1.2rem 0;
box-shadow: 0 3px 15px rgba(58, 123, 213, 0.2);
position: relative;
overflow: hidden;
}
.site-header::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.08'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
.header-container {
max-width: 1400px;
margin: 0 auto;
padding: 0 1.5rem;
display: flex;
justify-content: space-between;
align-items: center;
position: relative;
}
.logo {
display: flex;
align-items: center;
gap: 0.8rem;
transition: var(--transition);
}
.logo:hover {
transform: translateX(5px);
}
.logo-icon {
font-size: 2rem;
text-shadow: 0 2px 10px rgba(0,0,0,0.15);
}
.logo-text {
font-size: 1.4rem;
font-weight: 600;
text-shadow: 0 2px 10px rgba(0,0,0,0.15);
}
/* 导航菜单 */
.main-nav {
display: flex;
align-items: center;
}
.menu-toggle {
background: rgba(255,255,255,0.2);
border: none;
color: white;
font-size: 1.5rem;
cursor: pointer;
display: none;
padding: 0.5rem;
border-radius: 6px;
backdrop-filter: blur(5px);
transition: var(--transition);
}
.menu-toggle:hover {
background: rgba(255,255,255,0.3);
transform: scale(1.1);
}
.nav-menu {
display: flex;
list-style: none;
gap: 1.8rem;
}
.nav-menu a {
color: white;
text-decoration: none;
font-weight: 500;
transition: var(--transition);
padding: 0.5rem 0;
position: relative;
opacity: 0.9;
}
.nav-menu a::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 0;
height: 2px;
background-color: white;
transition: var(--transition);
}
.nav-menu a:hover {
opacity: 1;
}
.nav-menu a:hover::after {
width: 100%;
}
/* 公告栏 */
.announcement {
background-color: white;
padding: 1rem 0;
border-bottom: 1px solid var(--border);
box-shadow: 0 2px 10px rgba(0,0,0,0.03);
}
.announcement-container {
max-width: 1400px;
margin: 0 auto;
padding: 0 1.5rem;
}
.feature-badge {
display: inline-flex;
align-items: center;
gap: 0.3rem;
background-color: rgba(58, 123, 213, 0.1);
color: var(--primary-dark);
padding: 0.2rem 0.7rem;
border-radius: 20px;
font-size: 0.85rem;
margin-right: 0.8rem;
margin-bottom: 0.5rem;
transition: var(--transition);
}
.feature-badge:hover {
background-color: rgba(58, 123, 213, 0.15);
transform: translateY(-2px);
}
/* 主容器 */
.container {
max-width: 1400px;
margin: 2rem auto;
padding: 0 1.5rem;
}
/* 功能按钮区 */
.function-buttons {
display: flex;
flex-wrap: wrap;
gap: 1rem;
margin-bottom: 1.5rem;
padding: 1rem;
background: white;
border-radius: var(--radius);
box-shadow: var(--shadow);
}
.function-group {
display: flex;
gap: 0.8rem;
align-items: center;
}
.function-group label {
font-weight: 500;
color: var(--primary-dark);
white-space: nowrap;
}
/* 转换按钮区域 */
.convert-controls {
text-align: center;
margin-bottom: 1.5rem;
}
#convertBtn {
background: linear-gradient(135deg, var(--warning), #ff5e00);
color: white;
border: none;
padding: 0.9rem 2rem;
border-radius: 8px;
cursor: pointer;
font-size: 1.1rem;
font-weight: 600;
transition: var(--transition);
display: inline-flex;
align-items: center;
gap: 0.6rem;
box-shadow: 0 4px 15px rgba(255, 125, 0, 0.3);
margin-bottom: 0.5rem;
}
#convertBtn:hover {
transform: translateY(-3px) scale(1.02);
box-shadow: 0 6px 20px rgba(255, 125, 0, 0.4);
}
/* 编辑器区域 */
.editor-container {
display: flex;
gap: 1.8rem;
margin-bottom: 2.5rem;
flex-wrap: wrap;
}
.editor-section {
flex: 1;
min-width: 300px;
background: white;
border-radius: var(--radius);
box-shadow: var(--shadow);
overflow: hidden;
transition: var(--transition);
position: relative;
}
.editor-section::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 4px;
background: linear-gradient(90deg, var(--primary), var(--primary-light));
opacity: 0;
transition: var(--transition);
}
.editor-section:hover {
box-shadow: var(--shadow-strong);
transform: translateY(-5px);
}
.editor-section:hover::before {
opacity: 1;
}
.editor-header {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1.2rem 1.5rem;
background-color: var(--light);
border-bottom: 1px solid var(--border);
}
.editor-header h3 {
font-size: 1.2rem;
color: var(--primary-dark);
display: flex;
align-items: center;
gap: 0.6rem;
font-weight: 600;
}
.editor-header h3 i {
font-size: 1.3rem;
opacity: 0.85;
}
.editor {
min-height: 520px;
padding: 1.8rem;
outline: none;
overflow-y: auto;
line-height: 1.7;
background-color: white;
}
/* 预览区样式 */
#previewEditor {
line-height: 1.6;
}
#previewEditor h1, #previewEditor h2, #previewEditor h3,
#previewEditor h4, #previewEditor h5, #previewEditor h6 {
margin: 1.2rem 0 0.6rem;
color: var(--primary-dark);
font-weight: 600;
}
#previewEditor h1 {
font-size: 1.8rem;
padding-bottom: 0.5rem;
border-bottom: 2px solid var(--light);
}
#previewEditor h2 {
font-size: 1.5rem;
padding-bottom: 0.3rem;
border-bottom: 1px solid var(--light);
}
#previewEditor h3 {
font-size: 1.2rem;
}
#previewEditor p {
margin-bottom: 0.8rem;
}
#previewEditor ul, #previewEditor ol {
margin: 0 0 0.8rem 1.5rem;
padding-left: 1rem;
}
#previewEditor ul {
list-style-type: disc;
}
#previewEditor ul ul {
list-style-type: circle;
margin-bottom: 0.3rem;
}
#previewEditor ol {
list-style-type: decimal;
}
#previewEditor ol ol {
list-style-type: lower-alpha;
margin-bottom: 0.3rem;
}
#previewEditor li {
margin-bottom: 0.3rem;
}
#previewEditor table {
border-collapse: collapse;
width: 100%;
margin: 1rem 0;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}
#previewEditor th, #previewEditor td {
border: 1px solid #e9ecef;
padding: 12px 15px;
text-align: left;
}
#previewEditor th {
background-color: var(--light);
font-weight: 600;
color: var(--primary-dark);
}
#previewEditor tr:nth-child(even) {
background-color: #f8f9fa;
}
#previewEditor pre {
background-color: #f8f9fa;
padding: 1.2rem;
border-radius: 8px;
overflow-x: auto;
margin: 1rem 0;
border-left: 4px solid var(--primary);
}
#previewEditor code {
font-family: 'Consolas', 'Monaco', monospace;
font-size: 0.9rem;
}
/* 导出按钮区域 */
.button-container {
display: flex;
justify-content: center;
padding: 1rem;
}
.export-buttons {
display: flex;
gap: 1.5rem;
flex-wrap: wrap;
justify-content: center;
}
button {
background: linear-gradient(135deg, var(--primary), var(--primary-dark));
color: white;
border: none;
padding: 0.8rem 1.6rem;
border-radius: 8px;
cursor: pointer;
font-size: 1rem;
font-weight: 500;
transition: var(--transition);
display: flex;
align-items: center;
gap: 0.6rem;
box-shadow: 0 4px 15px rgba(58, 123, 213, 0.2);
position: relative;
overflow: hidden;
}
button::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
transition: 0.5s;
}
button:hover {
transform: translateY(-3px) scale(1.02);
box-shadow: 0 6px 20px rgba(58, 123, 213, 0.3);
}
button:hover::before {
left: 100%;
}
button.secondary {
background: linear-gradient(135deg, var(--secondary), #00a824);
box-shadow: 0 4px 15px rgba(0, 180, 42, 0.2);
}
button.warning {
background: linear-gradient(135deg, var(--warning), #e66a00);
box-shadow: 0 4px 15px rgba(255, 125, 0, 0.2);
}
button.danger {
background: linear-gradient(135deg, var(--danger), #e02020);
box-shadow: 0 4px 15px rgba(245, 63, 63, 0.2);
}
button i {
font-size: 1.1rem;
}
/* 通知样式 */
.notification {
position: fixed;
top: 25px;
right: 25px;
padding: 1.1rem 1.6rem;
border-radius: 10px;
color: white;
z-index: 1000;
transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15);
transform: translateY(-20px);
opacity: 0;
visibility: hidden;
display: flex;
align-items: center;
gap: 0.7rem;
max-width: 350px;
}
.notification.show {
transform: translateY(0);
opacity: 1;
visibility: visible;
}
.success {
background-color: #52c41a;
}
.error {
background-color: #ff4d4f;
}
.warning {
background-color: #faad14;
}
.notification i {
font-size: 1.3rem;
}
/* 响应式设计 */
@media (max-width: 768px) {
.menu-toggle {
display: block;
}
.nav-menu {
display: none;
position: absolute;
top: 100%;
left: 0;
right: 0;
background-color: var(--primary-dark);
flex-direction: column;
padding: 1.2rem;
gap: 1rem;
box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}
.nav-menu.active {
display: flex;
}
.function-buttons {
flex-direction: column;
align-items: stretch;
}
.function-group {
width: 100%;
}
.editor-container {
flex-direction: column;
gap: 1.5rem;
}
.editor {
min-height: 400px;
padding: 1.2rem;
}
.export-buttons {
flex-direction: column;
width: 100%;
gap: 1rem;
}
button {
width: 100%;
justify-content: center;
padding: 0.9rem 1rem;
}
.logo-text {
font-size: 1.1rem;
}
.announcement-container {
font-size: 0.9rem;
}
.feature-badge {
margin-right: 0.5rem;
padding: 0.15rem 0.6rem;
}
}
</style>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
<header class="site-header">
<div class="header-container">
<div class="logo">
<i class="fa fa-code logo-icon"></i>
<span class="logo-text">大飞哥软件自习室AI内容编辑器</span>
</div>
<nav class="main-nav">
<button class="menu-toggle" id="menuToggle">
<i class="fa fa-bars"></i>
</button>
<ul class="nav-menu">
<li><a href="https://space.bilibili.com/286436365" target="_blank">帮助</a></li>
<li><a href="https://blog.csdn.net/china365love" target="_blank">关于</a></li>
</ul>
</nav>
</div>
</header>
<div class="announcement">
<div class="announcement-container">
<p>
<span class="feature-badge"><i class="fa fa-check-circle"></i> 智能处理</span>
<span class="feature-badge"><i class="fa fa-magic"></i> 格式修复</span>
<span class="feature-badge"><i class="fa fa-eraser"></i> 内容清洗</span>
<span class="feature-badge"><i class="fa fa-th-large"></i> 智能排版</span>
<span class="feature-badge"><i class="fa fa-download"></i> 多格式导出</span>
支持AI生成内容一键格式化，解决特殊符号、表格错乱问题，完美导出Word/Excel/PDF文档
</p>
</div>
</div>
<div class="container">
<!-- 功能按钮区 -->
<div class="function-buttons">
<div class="function-group">
<label>格式修复：</label>
<button id="fixSymbolsBtn" class="warning"><i class="fa fa-wrench"></i> 修复特殊符号</button>
<button id="fixTablesBtn" class="warning"><i class="fa fa-table"></i> 修复表格格式</button>
</div>
<div class="function-group">
<label>内容清洗：</label>
<button id="cleanSpacesBtn"><i class="fa fa-eraser"></i> 清除多余空格</button>
<button id="removeMarkdownBtn" class="danger"><i class="fa fa-ban"></i> 移除所有标记</button>
</div>
<div class="function-group">
<label>智能排版：</label>
<button id="autoFormatBtn" class="secondary"><i class="fa fa-magic"></i> 自动排版</button>
<button id="clearAllBtn" class="danger"><i class="fa fa-trash"></i> 清空内容</button>
</div>
</div>
<!-- 转换按钮区域 -->
<div class="convert-controls">
<button id="convertBtn"><i class="fa fa-refresh"></i> 一键转换内容</button>
<p style="color: var(--gray); font-size: 0.9rem;">点击转换按钮可重新处理内容，解决格式问题</p>
</div>
<div class="editor-container">
<div class="editor-section">
<div class="editor-header">
<h3><i class="fa fa-file-text-o"></i> AI生成的内容</h3>
<button id="pasteBtn"><i class="fa fa-clipboard"></i> 粘贴内容</button>
</div>
<div class="editor" id="markdownEditor" contenteditable="true"></div>
</div>
<div class="editor-section">
<div class="editor-header">
<h3><i class="fa fa-eye"></i> 自动编辑预览区</h3>
<button id="copyBtn"><i class="fa fa-copy"></i> 复制内容</button>
</div>
<div class="editor" id="previewEditor" contenteditable="true"></div>
</div>
</div>
<div class="button-container">
<div class="export-buttons">
<button id="exportWordBtn"><i class="fa fa-file-word-o"></i> 导出Word</button>
<button id="exportPdfBtn" class="secondary"><i class="fa fa-file-pdf-o"></i> 导出PDF</button>
<button id="exportExcelBtn"><i class="fa fa-file-excel-o"></i> 导出Excel</button>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/FileSaver.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/xlsx.full.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/html-docx.js"></script>
<!-- 通知元素 -->
<div id="notification" class="notification">
<i class="fa fa-check-circle"></i>
<span id="notificationText"></span>
</div>
<script>
// DOM元素
const markdownEditor = document.getElementById('markdownEditor');
const previewEditor = document.getElementById('previewEditor');
const pasteBtn = document.getElementById('pasteBtn');
const copyBtn = document.getElementById('copyBtn');
const exportWordBtn = document.getElementById('exportWordBtn');
const exportPdfBtn = document.getElementById('exportPdfBtn');
const exportExcelBtn = document.getElementById('exportExcelBtn');
const menuToggle = document.getElementById('menuToggle');
const navMenu = document.querySelector('.nav-menu');
const notification = document.getElementById('notification');
const notificationText = document.getElementById('notificationText');
const convertBtn = document.getElementById('convertBtn');
// 新增功能按钮
const fixSymbolsBtn = document.getElementById('fixSymbolsBtn');
const fixTablesBtn = document.getElementById('fixTablesBtn');
const cleanSpacesBtn = document.getElementById('cleanSpacesBtn');
const removeMarkdownBtn = document.getElementById('removeMarkdownBtn');
const autoFormatBtn = document.getElementById('autoFormatBtn');
const clearAllBtn = document.getElementById('clearAllBtn');
// 移动端菜单切换
menuToggle.addEventListener('click', () => {
navMenu.classList.toggle('active');
});
// 显示通知
function showNotification(message, type = 'success') {
notificationText.textContent = message;
notification.className = `notification ${type}`;
notification.classList.add('show');
// 通知图标
const icon = notification.querySelector('i');
switch(type) {
case 'success': icon.className = 'fa fa-check-circle'; break;
case 'error': icon.className = 'fa fa-exclamation-circle'; break;
case 'warning': icon.className = 'fa fa-exclamation-triangle'; break;
default: icon.className = 'fa fa-info-circle';
}
setTimeout(() => {
notification.classList.remove('show');
}, 3000);
}
// 核心处理函数
function processAIContent(content, options = {}) {
let processed = content;
// 处理特殊空格和不可见字符
processed = processed.replace(/\u00A0/g, ' ');
processed = processed.replace(/\u200B/g, '');
processed = processed.replace(/\r/g, '');
// 格式修复：特殊符号处理
if (!options.skipSymbols) {
processed = processed.replace(/^(#{1,6})\s+(.*)$/gm, (match, hashes, text) => {
const level = hashes.length;
return `<h${level}>${text}</h${level}>`;
});
processed = processed.replace(/\*\*(.*?)\*\*/g, '<strong>$1</strong>');
processed = processed.replace(/\*(.*?)\*/g, '<em>$1</em>');
processed = processed.replace(/__(.*?)__/g, '<u>$1</u>');
processed = processed.replace(/~~(.*?)~~/g, '<s>$1</s>');
}
// 列表处理
if (!options.skipLists) {
processed = processed.replace(/^[-·*]\s+(.*)$/gm, '<li>$1</li>');
processed = processNestedLists(processed, 'ul', /<li>(.*?)<\/li>/g);
processed = processed.replace(/^(\d+)\.\s+(.*)$/gm, '<li>$2</li>');
processed = processed.replace(/^(①|②|③|④|⑤|⑥|⑦|⑧|⑨|⑩|⑪|⑫|⑬|⑭|⑮)\s+(.*)$/gm, '<li>$2</li>');
processed = processNestedLists(processed, 'ol', /<li>(.*?)<\/li>/g);
}
// 链接和图片处理
if (!options.skipLinks) {
processed = processed.replace(/\[([^\]]+)\]\(([^)]+)\)/g, '<a href="$2" target="_blank">$1</a>');
processed = processed.replace(/!\[([^\]]*)\]\(([^)]+)\)/g, '<img src="$2" alt="$1" style="max-width:100%;margin:1rem 0;">');
}
// 代码块处理
if (!options.skipCode) {
processed = processed.replace(/```([\s\S]*?)```/g, '<pre><code>$1</code></pre>');
processed = processed.replace(/`([^`]+)`/g, '<code>$1</code>');
}
// 表格处理
if (!options.skipTables) {
processed = processTables(processed);
}
// 段落处理
processed = processParagraphs(processed);
// 清理多余标签
processed = processed.replace(/<br>\s*<\/ul>/g, '</ul>');
processed = processed.replace(/<br>\s*<\/ol>/g, '</ol>');
processed = processed.replace(/<br>\s*<br>/g, '<br>');
return processed;
}
// 处理嵌套列表
function processNestedLists(content, tag, regex) {
let processed = content;
let changed = true;
while (changed) {
changed = false;
const newContent = processed.replace(regex, (match) => {
if (match.includes(`<${tag}>`) || match.includes(`</${tag}>`)) {
changed = true;
return `<${tag}>${match}</${tag}>`;
}
return match;
});
if (newContent !== processed) {
processed = newContent;
}
}
if (!processed.includes(`<${tag}>`)) {
processed = processed.replace(regex, (match) => `<${tag}>${match}</${tag}>`);
}
return processed;
}
// 处理表格
function processTables(content) {
const tableRegex = /(\|.*\|(?:\n\|.*\|)+)/g;
return content.replace(tableRegex, (match) => {
let rows = match.split('\n');
let tableHtml = '<table>';
rows.forEach((row, index) => {
if (!row.trim()) return;
if (row.includes('|---') || row.includes('|-')) return;
const cells = row.split('|')
.map(cell => cell.trim())
.filter(cell => cell.length > 0);
const tag = index === 0 ? 'th' : 'td';
tableHtml += '<tr>';
cells.forEach(cell => {
tableHtml += `<${tag}>${cell}</${tag}>`;
});
tableHtml += '</tr>';
});
tableHtml += '</table>';
return tableHtml;
});
}
// 处理段落和换行
function processParagraphs(content) {
let processed = content.replace(/\n/g, '<br>');
const lines = processed.split('<br>');
let inList = false;
let result = [];
lines.forEach(line => {
const trimmed = line.trim();
if (trimmed.startsWith('<ul>') || trimmed.startsWith('<ol>')) {
inList = true;
result.push(line);
} else if (trimmed.endsWith('</ul>') || trimmed.endsWith('</ol>')) {
inList = false;
result.push(line);
} else if (inList || trimmed.startsWith('<li>') ||
trimmed.startsWith('<table>') || trimmed.startsWith('</table>') ||
trimmed.startsWith('<pre>') || trimmed.startsWith('</pre>')) {
result.push(line);
} else if (trimmed.startsWith('<h') && trimmed.endsWith('>')) {
result.push(line);
} else if (trimmed === '') {
result.push(line);
} else {
result.push(`<p>${line}</p>`);
}
});
return result.join('<br>');
}
// 从HTML提取表格数据
function extractTablesFromHtml(html) {
const tempDiv = document.createElement('div');
tempDiv.innerHTML = html;
const tables = tempDiv.querySelectorAll('table');
const tableData = [];
tables.forEach(table => {
const rows = [];
table.querySelectorAll('tr').forEach(tr => {
const cells = [];
tr.querySelectorAll('th, td').forEach(cell => {
cells.push(cell.textContent);
});
if (cells.length > 0) rows.push(cells);
});
if (rows.length > 0) tableData.push(rows);
});
return tableData;
}
// 实时预览
function updatePreview() {
const content = markdownEditor.innerText;
const processed = processAIContent(content);
previewEditor.innerHTML = processed;
if (window.MathJax) {
MathJax.typeset([previewEditor]);
}
}
// 一键转换
convertBtn.addEventListener('click', () => {
convertBtn.innerHTML = '<i class="fa fa-spinner fa-spin"></i> 转换中...';
convertBtn.disabled = true;
setTimeout(() => {
updatePreview();
showNotification('内容转换完成');
convertBtn.innerHTML = '<i class="fa fa-refresh"></i> 一键转换内容';
convertBtn.disabled = false;
}, 500);
});
// 修复特殊符号
fixSymbolsBtn.addEventListener('click', () => {
let content = markdownEditor.innerText;
// 专门处理特殊符号
content = content.replace(/\u2022/g, '-') // 替换项目符号为减号
.replace(/\u2014/g, '--') // 替换长横线
.replace(/\u00A0/g, ' ') // 替换不间断空格
.replace(/\s{2,}/g, ' '); // 替换多个空格为单个
markdownEditor.innerText = content;
updatePreview();
showNotification('特殊符号修复完成');
});
// 修复表格格式
fixTablesBtn.addEventListener('click', () => {
let content = markdownEditor.innerText;
// 表格格式修复逻辑
const lines = content.split('\n');
let inTable = false;
let tableLines = [];
let result = [];
lines.forEach(line => {
if (line.includes('|')) {
inTable = true;
tableLines.push(line);
} else {
if (inTable) {
// 处理表格
const tableContent = tableLines.join('\n');
const fixedTable = processTables(tableContent);
result.push(fixedTable.replace(/<br>/g, '\n'));
tableLines = [];
inTable = false;
}
result.push(line);
}
});
// 处理最后一个表格
if (inTable) {
const tableContent = tableLines.join('\n');
const fixedTable = processTables(tableContent);
result.push(fixedTable.replace(/<br>/g, '\n'));
}
markdownEditor.innerText = result.join('\n');
updatePreview();
showNotification('表格格式修复完成');
});
// 清除多余空格
cleanSpacesBtn.addEventListener('click', () => {
let content = markdownEditor.innerText;
// 清除多余空格但保留格式
content = content.replace(/^\s+/gm, '') // 清除行首空格
.replace(/\s+$/gm, '') // 清除行尾空格
.replace(/\s{2,}/g, ' ') // 多个空格变一个
.replace(/\n{3,}/g, '\n\n'); // 多个空行变两个
markdownEditor.innerText = content;
updatePreview();
showNotification('多余空格清除完成');
});
// 移除所有标记
removeMarkdownBtn.addEventListener('click', () => {
if (confirm('确定要移除所有Markdown标记吗？这将只保留纯文本内容。')) {
let content = markdownEditor.innerText;
// 移除所有Markdown标记
content = content.replace(/^#{1,6}\s+/gm, '')
.replace(/\*\*|\*/g, '')
.replace(/__|_/g, '')
.replace(/~~/g, '')
.replace(/^[-·*]\s+/gm, '')
.replace(/^(\d+)\.\s+/gm, '$1. ')
.replace(/```[\s\S]*?```/g, (match) => {
return match.replace(/```/g, '').trim() + '\n';
})
.replace(/`/g, '')
.replace(/\[([^\]]+)\]\([^)]+\)/g, '$1')
.replace(/!\[([^\]]*)\]\([^)]+\)/g, '[图片: $1]');
markdownEditor.innerText = content;
updatePreview();
showNotification('所有标记已移除', 'warning');
}
});
// 自动排版
autoFormatBtn.addEventListener('click', () => {
let content = markdownEditor.innerText;
// 自动排版优化
content = content.replace(/(\n|^)(#{1,6}\s+.*?)(\n|$)/gm, '\n$2\n') // 标题前后加空行
.replace(/(\n|^)(\[.*?\]\(.*?\))(\n|$)/gm, ' $2 ') // 链接前后加空格
.replace(/(\n|^)(```.*?```)(\n|$)/gm, '\n$2\n'); // 代码块前后加空行
markdownEditor.innerText = content;
updatePreview();
showNotification('自动排版完成');
});
// 清空内容
clearAllBtn.addEventListener('click', () => {
if (confirm('确定要清空所有内容吗？')) {
markdownEditor.innerText = '';
previewEditor.innerHTML = '';
showNotification('内容已清空', 'warning');
}
});
// 粘贴内容
pasteBtn.addEventListener('click', async () => {
try {
const text = await navigator.clipboard.readText();
markdownEditor.innerText = text;
updatePreview();
showNotification('内容粘贴成功');
} catch (err) {
showNotification('粘贴失败，请手动粘贴', 'error');
console.error('粘贴失败:', err);
}
});
// 复制内容
copyBtn.addEventListener('click', async () => {
try {
await navigator.clipboard.writeText(previewEditor.innerText);
showNotification('内容复制成功');
} catch (err) {
showNotification('复制失败，请手动复制', 'error');
console.error('复制失败:', err);
}
});
// 导出Word
exportWordBtn.addEventListener('click', () => {
try {
const htmlContent = `
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
body { font-family: 'Microsoft YaHei', sans-serif; line-height: 1.6; }
h1, h2, h3 { color: #2c3e50; margin-top: 1.2em; margin-bottom: 0.6em; }
ul, ol { margin: 0.8em 0; padding-left: 2em; }
table { border-collapse: collapse; width: 100%; margin: 1em 0; }
th, td { border: 1px solid #ddd; padding: 10px 12px; text-align: left; }
th { background-color: #f5f5f5; }
p { margin: 0.8em 0; }
</style>
</head>
<body>
${previewEditor.innerHTML}
</body>
</html>
`;
const converted = htmlDocx.asBlob(htmlContent);
saveAs(converted, '大飞哥软件自习室-AI处理内容.docx');
showNotification('Word导出成功');
} catch (error) {
showNotification('Word导出失败，请重试', 'error');
console.error('Word导出错误:', error);
}
});
// 导出PDF
exportPdfBtn.addEventListener('click', () => {
const printWindow = window.open('', '_blank');
printWindow.document.write(`
<html>
<head>
<title>大飞哥软件自习室-AI处理内容</title>
<meta charset="UTF-8">
<style>
@media print {
@page { margin: 1.5cm; }
body { font-family: 'Microsoft YaHei', sans-serif; line-height: 1.6; }
}
body { font-family: 'Microsoft YaHei', sans-serif; line-height: 1.6; padding: 20px; }
h1, h2, h3 { color: #2c3e50; margin-top: 1.2em; margin-bottom: 0.6em; }
ul, ol { margin: 0.8em 0; padding-left: 2em; }
table { border-collapse: collapse; width: 100%; margin: 1em 0; }
th, td { border: 1px solid #ddd; padding: 10px 12px; text-align: left; }
th { background-color: #f5f5f5; }
</style>
</head>
<body>${previewEditor.innerHTML}</body>
</html>
`);
printWindow.document.close();
printWindow.onload = function() {
printWindow.print();
};
showNotification('请在打印界面选择"另存为PDF"完成导出');
});
// 导出Excel
exportExcelBtn.addEventListener('click', () => {
const tables = extractTablesFromHtml(previewEditor.innerHTML);
if (tables.length === 0) {
showNotification('没有找到表格内容', 'error');
return;
}
const wb = XLSX.utils.book_new();
tables.forEach((table, index) => {
const ws = XLSX.utils.aoa_to_sheet(table);
XLSX.utils.book_append_sheet(wb, ws, `表格${index + 1}`);
});
const excelBuffer = XLSX.write(wb, { bookType: 'xlsx', type: 'array' });
const blob = new Blob([excelBuffer], { type: 'application/octet-stream' });
saveAs(blob, '大飞哥软件自习室-AI处理表格.xlsx');
showNotification('Excel导出成功');
});
// 监听编辑区变化
markdownEditor.addEventListener('input', updatePreview);
// 初始化内容
window.addEventListener('DOMContentLoaded', () => {
markdownEditor.innerText = `# 欢迎使用大飞哥软件自习室AI内容编辑器
## 使用说明
1. 在左框粘贴AI生成的文本/或其他内容
2. 右框将显示自动编辑的预览效果
3. 可使用上方功能按钮进行格式修复和内容清洗
4. 点击"导出Word"可将内容导出为Word文档
5. 如果有表格内容，可以点击"导出Excel"单独导出表格
## 功能特点
- 格式修复：处理特殊符号、修复表格错乱
- 内容清洗：清除多余空格、移除Markdown标记
- 智能排版：自动优化文档结构和格式
- 多格式导出：支持Word、PDF、Excel格式
## 示例内容
### 无序列表
- 项目一：资质许可办理
- 项目二：企业服务
- 子项目1：工商财税
- 子项目2：知识产权
- 项目三：企业政策补贴
### 有序列表
1. 第一步 企业数字化服务
2. 第二步 数字化系统搭建
①. 网站/小程序开发
②. AI智能体部署
③. 各类成品管理系统
### 表格示例
| 服务类型 | 包含内容 | 价格范围 |
|---------|---------|---------|
| 基础服务 | 工商注册、代理记账 | 1000-3000元/年 |
| 增值服务 | 商标注册、专利申请 | 2000-5000元/项 |
| 定制服务 | 系统开发、AI部署 | 10000元起 |
### 格式示例
**粗体文本** - 用于强调重要内容
*斜体文本* - 用于补充说明
~~删除线文本~~ - 用于标记已取消内容
[链接示例]([url]https://blog.csdn.net/china365love[/url])`;
updatePreview();
});
</script>
</body>
</html>依托精准的格式识别算法和人性化的功能设计，大飞哥软件自习室AI内容编辑器已成为众多用户处理AI生成内容的首选工具，让内容编辑从繁琐的格式调整中解放出来，更专注于内容本身的质量提升。
IP卡
发表于 
提升卡
置顶卡
变色卡
千斤顶
显身卡
发表于 
发表于 
发表于 
