直接在 html 中写特殊字符如 、& 需使用实体编码（如 <、>、&），否则会被浏览器解析为标签或语法错误。
直接在 HTML 中写特殊字符如 、<code>&、"，浏览器会按语法解析，导致内容错位、标签被误创建，甚至触发 XSS。关键不是“要不要转义”，而是“在哪种上下文中插入数据”——文本节点、属性值、脚本内联、URL 参数，处理方式完全不同。
文本内容插入 td、div、p 等标签内
这是最常见也最容易出错的场景。只要数据含 、<code>&、>，就必须转义，否则 DOM 结构立刻混乱。
- 必须转义的五个基础字符：
&→&，→ <code>，<code>>→>，"→"，'→'（或'） - 顺序不能错：先转
&，再转和 <code>>，否则可能被二次处理成 <code>< - 推荐用
textContent赋值：它绕过 HTML 解析器，自动当纯文本处理，安全又省心 - 避免拼接字符串到
innerHTML，尤其数据来自用户或 API；若必须用innerHTML，先清洗再插入
HTML 属性值中包含特殊字符
title、data-*、alt、class 等属性里出现 、<code>&、引号时，不转义会导致属性提前截断，甚至执行恶意代码。
- 属性值用双引号包裹时，
"必须转为"；用单引号时，'要转为' 和 <code>&在属性中同样危险：例如title="x 会解析失败，应写成 <code>title="x- 动态设置属性优先用
element.setAttribute('title', value)，它自动处理引号，但不会转或 <code>&，这部分仍需手动或映射表处理
JavaScript 中安全插入 HTML 字符串
前端用 JS 拼接表格或更新内容时，容易因 replace 链顺序错误或遗漏字符导致双重转义或显示异常。
- 别用连续
.replace()：比如str.replace(/,' 会把 <code> 变成 <code>< - 改用映射表一次性遍历：
str.replace(/[&"']/g, c => ({'&': '&', '': '>', '"': '"', "'": '''})[c]) - 更稳妥的做法是创建临时元素：
const el = document.createElement('div'); el.textContent = str; return el.innerHTML;—— 利用浏览器原生转义能力
服务端返回 JSON 后的前端处理逻辑
后端传来的字段可能已用 html.escape() 处理过，前端拿到的是已转义字符串。此时插入方式决定是否要还原。
- 用
el.textContent = data.field→ 完全不需要额外操作，浏览器照常显示<div> 字面量 <li>用 <code>el.innerHTML = data.field→ 若字段已是转义结果（如<div>），直接插入只会显示源码；需先 <code>html.unescape()还原，再视情况过滤或清洗 - 框架如 React 的
{data.field}默认等价于 textContent；若要用dangerouslySetInnerHTML，必须确保该字段可信且不含危险标签
