html如何删除格式_HTML富文本格式清除（去样式/标签）方法
答案：清除HTML富文本格式可通过JavaScript正则或DOM操作去除标签和样式，如用textContent提取纯文本，或正则替换移除style、class等属性并清理空标签；也可借助DOMPurify等库配置允许标签和属性，或在服务端使用strip_tags等函数限制标签范围，实现安全的内容净化。
在处理HTML内容时，经常会遇到需要清除富文本中的格式（如字体、颜色、对齐方式等）或去除多余标签的情况。这在从Word粘贴内容、编辑器间数据迁移或提交表单时尤为常见。以下是几种实用的HTML富文本格式清除方法。
使用JavaScript去除HTML标签和样式
通过正则表达式或DOM操作可以有效清除HTML中的内联样式和无用标签。
1. 基础去标签方法：仅保留纯文本或基本结构（如段落、换行）。
function stripHtml(html) {
let temp = document.createElement('div');
temp.innerHTML = html;
return temp.textContent || temp.innerText || '';
}
该方法将HTML字符串插入临时元素，再提取文本内容，自动剥离所有标签。
2. 保留部分标签，清除样式：若需保留p、br、strong等基础标签，可使用正则替换style、class等属性。
function cleanHtml(html) { // 移除 style, class, 属性 html = html.replace(/<[^>]*?(style|class|align|face)[^>]*>/gi, ''); // 清理空标签 html = html.replace(/<([^>]+)>\s*<\/\1>/g, ''); return html; }
function cleanHtml(html) {
// 移除 style, class, 属性
html = html.replace(/<[^>]*?(style|class|align|face)[^>]*>/gi, '');
// 清理空标签
html = html.replace(/<([^>]+)>\s*<\/\1>/g, '');
return html;
}
利用浏览器原生API简化处理
借助 textContent 和 innerHTML 的特性，能快速实现格式剥离。
例如，在富文本编辑器中获取纯内容：
const editor = document.getElementById('editor');
const plainText = editor.textContent; // 完全无格式文本
如果希望保留换行但去掉样式，可结合换行符处理：
const cleanText = editor.innerHTML .replace(/
/gi, '\n') .replace(/(.*)<\/p>/gi, '$1\n') .replace(/<[^>]+>/g, '');
服务端或库级解决方案
对于更复杂的场景，推荐使用成熟工具库或后端过滤。
1. 使用 DOMPurify + 配置清除样式：
import DOMPurify from 'dompurify';
const clean = DOMPurify.sanitize(dirty, {
ALLOWED_TAGS: ['p', 'br', 'strong', 'em'],
ALLOWED_ATTR: [] // 不允许任何属性，清除style/class等
});
2. 后端过滤（PHP示例）：使用 strip_tags 限制允许标签。
$clean = strip_tags($html, '
');
基本上就这些常用方法。根据实际需求选择客户端即时清理还是服务端统一处理，关键是明确要保留哪些结构，去掉哪些冗余样式与标签。操作不复杂，但容易忽略细节导致残留样式问题。
