code标签不防解析，需先转义内容再插入；因其仅为语义标签，浏览器仍按html流程解析，未转义的

code 标签本身不防解析，必须先转义内容再塞进去，否则 <script>alert(1)</script> 会真执行。

为什么 code 标签里写 HTML 还是会被执行

因为 code 只是语义标签，浏览器照常走 HTML 解析流程。只要里面含未转义的 、<code>>、& 等字符，就会被当作真实标签或属性处理——比如 <img src="https://img.php.cn/?x-oss-process=image/resize,p_40" alt="避免HTML code标签被恶意解析的安全教程"> 插进去，鼠标悬停就弹窗。

常见错误现象：

• 直接写 <code><div>hello</div>，结果页面真渲染出 <div> 元素 <li>用 <code>innerHTML = '<code>' + userInput + ''，把用户输入原样拼进 DOM
• 以为 <pre class="brush:php;toolbar:false;">&lt;code&gt;&lt;/code&gt; 嵌套就能自动防转义，其实它只保留换行和空格，不碰内容</pre>

安全做法：先转义，再塞进 code

核心动作只有一步：把原始字符串里的 、<code>>、&、"、' 替换成对应 HTML 实体，再赋给 code 的 textContent 或 innerHTML。


HTML Extract
使用 MinerU 从 HTML 页面和文件中提取内容，将 HTML 转换为保持标题、列表、表格及文本层次结构的干净、结构化 Markdown。F...
下载

实操建议：

• 优先用 textContent：简单、零风险、不用手动转义
  document.querySelector('code').textContent = rawHtml;
• 如果必须用 innerHTML（比如要配合 Prism.js 高亮），先转义再赋值：
  

  function htmlEscape(str) { const el = document.createElement('div'); el.textContent = str; return el.innerHTML; }<br>codeEl.innerHTML = htmlEscape(rawHtml);

• 别信正则：手写 replace(/, ' 会漏掉 <code>、<code> 等编码变体，浏览器照样解析

需要语法高亮时怎么避免 XSS

Prism.js、highlight.js 这类库输入的是「纯文本字符串」，不是原始 HTML。如果传进去的是未转义内容，它们内部可能误解析、漏着色，甚至触发 XSS。

正确流程：

• 原始 HTML 字符串 → 先用 htmlEscape() 或 textContent 转义 → 得到纯文本
• 把纯文本塞进 code.textContent
• 再调用 Prism.highlightElement(codeEl) —— 它只对文本做着色，不重新解析 HTML
• 绝对不要：先 code.innerHTML = rawHtml，再 highlightElement，那等于先执行一遍恶意代码

最容易被忽略的一点：code 标签只是容器，真正决定是否执行的，是内容进 DOM 前有没有被当成纯文本处理。一旦走 innerHTML 赋值路径，就必须确保字符串里每个 都已是 <code>，没有例外。