code标签不防解析，需先转义html特殊字符再用textcontent插入；直接innerhtml赋值或误信pre+code自动防护会导致xss风险。
code 标签本身不防解析，它只是语义标记——浏览器照常执行里面未转义的 HTML 和 JS。想让它“只显示代码”，必须先处理内容，再塞进去。
为什么 code 里写 <script>alert(1)</script> 会弹窗
因为 code 不做任何转义，<script></script> 这串字符在插入 DOM 时仍被 HTML 解析器识别为真实标签。常见错误包括：
- 直接用
innerHTML赋值原始 HTML 字符串 - 把
<div> 这类字符串原样放进 <code><code>，结果页面真渲染出一个div - 误以为
<pre class="brush:php;toolbar:false;"><code></code></pre>套用就能自动防解析（它只保留缩进和换行） → <code>-
>→> -
&→& -
"→" -
'→'
正确做法：先转义，再塞进 code
必须把原始字符串中的 、<code>>、&、"、' 全部替换成对应 HTML 实体，再交给 code 显示：
示例（JavaScript）：
Article To Html
下载
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
const rawHtml = '<div class="box"><strong>test</strong></div>';
document.querySelector('code').textContent = rawHtml;
注意：这里用的是 textContent，不是 innerHTML。它绕过解析器，所有字符原样上屏。
需要语法高亮？别跳过转义这步
像 Prism.js 或 highlight.js 这类库，输入必须是已转义的纯文本。如果传进去的是未转义的 <script></script>，它们可能：
- 把
当成标签起始，导致高亮错位 - 漏着色，甚至把用户输入误判为 JS 语法触发执行（极少见但存在风险）
- 引入 XSS 漏洞，尤其当高亮后又用
innerHTML插入页面时
安全链路是：原始字符串 → HTML 实体转义 → textContent 设置 → Prism.highlightElement() → （可选）再用 innerHTML 渲染高亮结果。
最容易被忽略的一点：不要混用 textContent 和 innerHTML 操作同一个元素。前者设完再用后者覆盖，等于把刚防住的解析漏洞又亲手打开了。
