HTML 里怎么写、& 这些符号
直接写 、<code>>、&，别用键盘上按出来的原字符。浏览器一见到裸的 就以为是标签开头，后面内容全乱套——比如你写 <code><div>price:，浏览器会把 <code> 当成不完整标签处理，渲染出错甚至丢内容。<p> 常见错误现象：<code> 显示成空白或整个段落消失；<code>& 后面跟着字母（如 ©）却显示成原文本，说明前面缺了分号或 & 本身没转义。
- 所有 HTML 特殊字符都必须用实体表示：尖括号、引号、& 符号、版权符、空格（
- 实体分两种：命名式（如
©）和数字式（如©），推荐优先用命名式，更可读 - 注意
&必须第一个转义——否则©会被当成普通文本，因为浏览器找不到开头的&
哪些符号必须转义，哪些可以不转
不是所有符号都要转，只在 HTML 解析上下文中“有歧义”的才需要。比如纯文本内容里 @、_、+ 完全安全；但 、<code>>、&、"（属性值内）、'（单引号属性内）一定得转。
使用场景差异明显：在 <script></script> 或 <style></style> 块里， 和 <code>& 不需要转义（因为里面不走 HTML 解析）；但在 <p></p> 或属性值中，就必须转。
立即学习 “ 前端免费学习笔记（深入）”；
-
"在双引号属性中必须写成"（例如：<a href="#top">Top</a>） -
'在单引号属性中必须写成'（但 IE 不支持'，稳妥起见统一用'） - 中文标点如《》、【】、「」不用转义，它们不是 HTML 元字符
JavaScript 插入 HTML 时的双重转义陷阱
用 innerHTML 或 document.write() 动态写入内容时，容易漏掉一层转义：JS 字符串里的 & 本身就要被 JS 解析一次，再被 HTML 解析一次。
比如你想显示 <span>5 & 3</span>，写成 el.innerHTML = "<span>5 & 3</span>" 是错的——JS 先把 & 当作实体解析，传给 HTML 时只剩一个 &，导致后续 3 被误判。
- 正确写法是：把
&写成&，即el.innerHTML = "<span>5 & 3</span>" - 更稳的方式是避免拼接 HTML 字符串，改用
textContent+ 元素创建，或用模板字符串配合DOMPurify等库 - 服务端渲染时同理：模板引擎（如 EJS、Jinja）默认不自动转义，需显式调用
或{{}}的转义语法
空格、换行、连续空格怎么控制显示
HTML 默认合并空白符：多个空格、制表符、换行全当一个空格处理。想保留格式，不能靠多敲空格。
性能影响很小，但语义和可访问性受影响——屏幕阅读器会跳过 ，而 <pre class="brush:php;toolbar:false;"></pre> 会强制等宽字体和换行，不一定符合设计预期。
- 单个不间断空格用
- 整段预格式化内容用
<pre class="brush:php;toolbar:false;"></pre>标签，它会保留所有空白和换行 - 仅需保留换行、不强制等宽？用 CSS：
white-space: pre-line或pre-wrap - 别用
<br>模拟段落间距，那是语义错误；该用<p></p>就用<p></p>
事情说清了就结束。真正麻烦的从来不是记几个实体码，而是搞清“谁在解析、在哪解析、解析几轮”。
