本文介绍如何在网页中实时预览 textarea 输入的纯文本，既保留真实换行效果，又正确处理 `\n` 等转义序列，避免被当作普通字符显示，并提供健壮、可立即运行的 javascript 实现方案。
在 Web 开发中，常需将
✅ 正确做法是：
- 监听 input 事件（非 change），确保每次按键/粘贴都即时响应；
- 对输入值做转义序列清理：用正则 /\\n/g 匹配所有字面量 \n 并移除（注意双反斜杠在 JS 字符串中表示一个 \）；
- 用 innerHTML 渲染，并配合 CSS 控制空白处理，使真实换行生效；
- 初始化时触发一次更新，保证页面加载后预览区立即显示初始内容。
以下是完整可运行示例：
⚠️ 注意事项：
立即学习“前端免费学习笔记（深入）”；
- 若需支持更多转义序列（如 \t、\\），可扩展 .replace() 链，例如：.replace(/\\n/g, '').replace(/\\t/g, '\t')；
- 绝对不要将用户未过滤的内容直接赋给 innerHTML（存在 XSS 风险），本例因仅处理纯文本且无 等标签字符，风险可控；若输入可能含 HTML 标签，请改用 textContent +
+ white-space: pre-wrap 方案；
- white-space: pre-wrap 是关键 CSS 属性：它让元素像
一样保留换行和空格，同时支持自动折行，比单纯
更友好。
总结：精准控制文本渲染需兼顾 JavaScript 字符串处理与 CSS 白空间行为。本方案以最小侵入性达成“去转义、保换行、即时响应”三重目标，适用于代码片段预览、日志查看等典型场景。
