答案：清除HTML富文本格式可通过JavaScript正则或DOM操作去除标签和样式，如用textContent提取纯文本，或正则替换移除style、class等属性并清理空标签；也可借助DOMPurify等库配置允许标签和属性，或在服务端使用strip_tags等函数限制标签范围，实现安全的内容净化。
在处理HTML内容时，经常会遇到需要清除富文本中的格式（如字体、颜色、对齐方式等）或去除多余标签的情况。这在从Word粘贴内容、编辑器间数据迁移或提交表单时尤为常见。以下是几种实用的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;
}
借助 textContent 和 innerHTML 的特性，能快速实现格式剥离。
例如，在富文本编辑器中获取纯内容：
const editor = document.getElementById('editor');
const plainText = editor.textContent; // 完全无格式文本
如果希望保留换行但去掉样式，可结合换行符处理：
const cleanText = editor.innerHTML .replace(/<br>/gi, '\n') .replace(/<p>(.*)<\/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, '<p><br><strong><em>');
基本上就这些常用方法。根据实际需求选择客户端即时清理还是服务端统一处理，关键是明确要保留哪些结构，去掉哪些冗余样式与标签。操作不复杂，但容易忽略细节导致残留样式问题。
以上就是html如何删除格式_HTML富文本格式清除（去样式/标签）方法的详细内容，更多请关注php中文网其它相关文章！
HTML怎么学习？HTML怎么入门？HTML在哪学？HTML怎么学才快？不用担心，这里为大家提供了HTML速学教程(入门课程)，有需要的小伙伴保存下载就能学习啦！
广告Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
965
收藏
