<code>标签仅用于语义化标记代码文本，不执行JavaScript；要同时显示和运行JS，须用<pre><code>展示转义后的代码，并用独立<script>标签执行。
<code> 标签本身不执行 JavaScript，只负责语义化标记——它告诉浏览器“这段文字是代码”，但不会让浏览器去运行它。想在网页中既「显示」JavaScript 代码，又「运行」它，必须分开处理：显示用 <code> + <pre>，运行用 <script>。
为什么直接把 JS 代码塞进 <code> 里不显示或乱码
常见现象：页面上只看到半截代码、<script> 消失、尖括号被当成 HTML 标签解析、缩进全塌陷。
- 浏览器会把
<和>当成标签起始/结束符，除非转义为和 <code>> -
<code>是行内元素，自动合并空白符和换行，多行代码会被压成一行 - 如果代码里有
&，也得转成&，否则可能触发实体解析错误
正确显示 JS 代码块：必须套 <pre> + 转义 + 等宽字体
要保留缩进、换行、符号原样，三步缺一不可：
- 用
<pre><code class="javascript">.../pre>包裹（<code>嵌在<pre>里） - 手动把原始 JS 中的
<→、<code>>→>、&→& - 加一句 CSS：
code { font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace; }
示例（显示一段带 <script> 的代码）：
立即学习“Java免费学习笔记（深入）”；
function hello() {
console.log("Hello");
}
想同时「显示代码」和「运行效果」，别混在一起
一个常见误区：把 <script> 标签内容直接复制进 <pre><code> —— 这会导致两遍解析：一遍被当成 HTML 渲染（失败），一遍被当脚本执行（可能成功但不可见）。
- 显示代码：用转义后的纯文本，放在
<pre><code> - 运行代码：另起一组
<script>，写在 HTML 其他位置（推荐放</body>前） - 如果要动态渲染运行结果，用
document.getElementById(...).textContent = ...写入预设的<pre><code>容器，而不是试图让<code>自己执行
用 Prism.js 或 Highlight.js 时，仍要先转义
语法高亮库（如 Prism.js）依赖 DOM 中已存在的、格式正确的文本节点。如果原始 HTML 里没转义 <，JS 库根本拿不到完整代码字符串。
- 引入 Prism 后，仍需确保
<code>内容是转义过的 HTML 实体 - 不要依赖
Prism.highlightElement()自动修复未转义内容——它不处理 HTML 解析阶段的损坏 - 服务端渲染或静态生成时，建议用模板引擎（如 Nunjucks、EJS）的
escape过滤器，而不是手写
最易被忽略的一点：转义不是可选项，是 HTML 解析规则决定的硬性前提；哪怕用了高亮库、加了 CSS、嵌了 <pre>，只要没转义，就一定丢字符或报错。
