标签仅语义化包裹代码，不处理转义或格式；直接插入api响应会引发解析错误、xss风险或格式丢失；须先转义再嵌套于中，并用配合css实现响应式断行。
<code> 标签本身不处理 API 返回的原始数据，它只负责语义化地包裹已准备好的代码文本；直接把 JSON 响应体或 HTML 字符串塞进 <code> 里，大概率会解析失败、显示空白或破坏页面结构。
为什么不能直接 innerHTML = response.data
API 返回的 JSON 字符串（如 {"id":1,"title":"hello"}）含双引号、花括号等字符，若未转义就写入 <code>，浏览器会尝试解析其中的 或 <code>> ——哪怕响应里没 HTML，只要前端用 innerHTML 直接插入，就可能被误判为标签开始/结束。更危险的是，某些后端返回带 HTML 片段的字段（比如富文本内容），不转义就塞进去等于执行 XSS。
- 必须对响应字符串做 HTML 实体转义：把
→ <code><，>→>，&→& - 不要依赖
<code>自动转义 —— 它不干这事 - 如果用
textContent赋值，虽安全但会丢失换行和缩进（因为<code>是行内元素）
多行 JSON / XML 响应必须嵌套在 <pre class="brush:php;toolbar:false;"></pre> 里
单独用 <code> 显示 API 返回的 JSON，格式全丢：所有换行变空格，缩进塌成一团。真正能保留结构的是
<pre class="brush:php;toolbar:false;"><code>...</code>
<pre class="brush:php;toolbar:false;"></pre> 管格式（空格、换行、tab），<code><code>管语义（这是代码）——二者缺一不可- 响应体建议先
JSON.stringify(data, null, 2)格式化，再转义，最后塞进<pre class="brush:php;toolbar:false;"><code></code></pre> - 别忘了加 CSS 控制溢出：
pre { overflow-x: auto; max-width: 100%; }，否则宽 JSON 会撑破容器
展示 API 请求 URL 时，<wbr></wbr> 比 <code> 更关键
长 API 地址（如 https://api.example.com/v2/users/1234567890/search?filter=active&sort=createdAt&page=3）直接放 <code> 里，在窄屏上要么折断在单词中间，要么横向滚动。这时 <wbr></wbr> 才是解法：
- 在路径斜杠
/、查询符?、参数分隔符&、等号=后手动插<wbr></wbr> - 例如：
https://api.example.com/<wbr>v2/<wbr>users/<wbr>1234567890/<wbr>search?<wbr>filter=active&<wbr>sort=createdAt</wbr></wbr></wbr></wbr></wbr></wbr> - 必须配 CSS：
code { white-space: normal; }，否则<wbr></wbr>不生效
最容易被忽略的是：API 响应展示不是“贴代码”那么简单，它横跨转义、格式保留、语义标记、响应式断行四个层面；少做一步，轻则显示错乱，重则引入安全风险。
大量免费API接口：立即使用
涵盖生活服务API、金融科技API、企业工商API、等相关的API接口服务。免费API接口可安全、合规地连接上下游，为数据API应用能力赋能！
