必须转义的只有5个字符：&、、"、'；中文、emoji等utf-8字符原生支持，前提是文档声明了charset=utf-8；最稳妥做法是统一使用命名实体。
表格单元格里出现
这不是 bug，是浏览器在解析 HTML 时把
<td> 标签，后续内容全乱套。
<p>必须转义的只有 5 个字符：<code>、<code>>、&、"、'。其他如中文、emoji、©、® 等 UTF-8 原生支持，不用转——前提是文档声明了 <meta charset="UTF-8">。
- 最稳妥：统一用命名实体，比如
、<code>&、" - 别用十六进制编码（如
），IE 和旧版 XML 解析器容易不认 - 如果内容来自 JS 动态生成，别拼字符串，优先用
textContent赋值，它自动规避所有转义问题
后端返回 JSON，表格里显示的是
这是双重转义：后端用 html.escape() 编码了一次，前端又手动或框架自动再 encode 一次。典型现象是页面上看到字面量 ，而不是渲染后的
<p>检查三处：</p><div class="aritcle_card flexRow artxards">
<div class="artcardd flexRow">
<a class="aritcle_card_img" rel="nofollow" href="/xiazai/skill8961" title="html-to-pptx-converter"><img
src="https://img.php.cn/upload/skill/000/000/081/179232667384043.jpg" alt="html-to-pptx-converter" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a>
<div class="aritcle_card_info flexColumn">
<a rel="nofollow" href="/xiazai/skill8961" title="html-to-pptx-converter" class="overflowclass">html-to-pptx-converter</a>
<p class="overflowclass">使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。</p>
</div>
<a rel="nofollow" href="/xiazai/skill8961" title="html-to-pptx-converter" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span>
</a>
</div>
</div>
<ul>
<li>Python 后端是否对字段重复调用了 <code>html.escape()？读数据库后展示前才该调用一次
innerHTML = data.content —— 如果 data.content 已是转义后的字符串，再塞进 innerHTML 就会原样输出{{ content }} 还是 v-html/dangerouslySetInnerHTML？前者自动转义，后者要求传入已转义好的 HTML 字符串表格中空格、换行、制表符全被压成一个空格
HTML 默认折叠空白符，<td>line1\nline2\t extra </td> 渲染出来就是 “line1 line2 extra”。这不是转义问题，是 CSS 白空格处理规则。
- 想保留换行：加 CSS
white-space: pre-line到<td> 或父级样式 <li>想保留所有空格和缩进：用 <code>white-space: pre，但注意它不自动换行 - 别指望用
- 表格中真正需要转义的空白字符只有
- 绝对不要用
innerHTML +=拼接用户数据；改用document.createElement('td')+textContent - 如果非得用 innerHTML，先对每个变量做转义：Python 用
html.escape()，JS 可封装函数function escapeHtml(str) { return str.replace(/[&"']/g, c => ({'&': '&', '': '>', '"': '"', "'": '''})[c]); } - 框架场景下（如 React），直接插值
{item.price} 即可，JSX 自动转义
用 JS 动态生成表格时，innerHTML += '
' 报错或漏内容
字符串拼接 HTML 是高危操作。一旦变量含 & 或 ，拼出来的片段就可能被截断或注入。
真正麻烦的不是怎么转义，而是判断「该不该转」——输入来源是否可信、输出上下文是 innerHTML 还是 textContent、服务端是否已处理过。混用两层转义比完全不转更难排查。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
