textarea中换行必须用\n而非，因在textarea或textContent中会退化为字符串；取值用.value、存储用TEXT类型、展示用white-space:pre-line。
直接保存 <br> 标签会丢失换行？问题出在哪儿
不是 <br> 本身不能保存，而是你把它塞进了不该塞的地方：比如当成纯文本赋给 textarea.value，或用 textContent 插入 DOM。浏览器会把 <br> 当作 HTML 标签解析，但一旦进到 textarea 或被 textContent 处理，它就退化成普通字符串，后续再读出来时只剩字面量 <br>，而不是真正的换行行为。
textarea 里要存换行，必须用 \n，不是 <br>
用户在 textarea 按回车，浏览器原生生成的是 \n（或 \r\n），不是 <br>。所以保存逻辑必须围绕这个事实设计：
- 前端取值：用
document.querySelector('textarea').value—— 这拿到的是含\n的原始字符串 - 提交前别乱 replace：
.replace(/\s+/g, ' ')、.trim()都会吃掉\n，直接删掉这类操作 - 后端接收后，数据库字段用
TEXT或支持换行的类型（如 MySQL 的TEXT、PostgreSQL 的TEXT），原样存\n，不转义、不过滤 - 调试验证：在控制台执行
console.log(JSON.stringify(textarea.value))，看到引号里有"\n"才算成功保住了
从数据库读出 \n 再填回 textarea，别用 innerHTML
很多人把数据库读出的带 \n 的字符串，错误地用 innerHTML 塞进 textarea，结果 \n 被当作文本渲染，没效果。正确做法只有一条：
- 必须用
.value = str直接赋值，例如：document.getElementById('myTa').value = data.content - 不要用
.innerHTML、.textContent、.innerText设置textarea的内容 —— 它们都不触发换行解析 - 如果数据里混了
<br>（比如从富文本粘贴来的），先统一转成\n：str.replace(/<br\s*\/?>/gi, '\n')
，再赋给.value
页面展示带换行的文本，white-space: pre-line 是最稳选择
想把数据库里存的 \n 在普通 <div> 里正常显示为换行，别手痒写一堆 <br>，CSS 就能搞定：
立即学习“前端免费学习笔记（深入）”；
- 给容器加样式：
style="white-space: pre-line;" - 确保插入方式是
textContent（安全）或innerHTML（需确认无 XSS）—— 两种都行，只要内容含真实\n - 避免用
pre：它会保留所有空格和缩进，容易破坏排版 - 别信 placeholder 里的
\n：部分老浏览器不支持textarea[placeholder]解析换行，别依赖它做功能
真正容易被忽略的点是：换行是否“存在”，和换行是否“可见”，是两个独立环节。前端取值、后端存储、数据库字段类型、HTML 渲染方式，任意一环把 \n 当空白干掉，或者误当成标签处理，整条链就断了。盯住 JSON.stringify() 输出看 \n 是否还在，比猜更可靠。
