API字符串含不可见控制字符（如\u00a0、\u200b等）导致HTML渲染错乱，需用针对性正则清洗或服务端前置过滤，避免前端兜底。
API返回的字符串里有大量空格，直接显示会错乱
HTML不会自动压缩连续空白字符，JSON里带的\u00a0（不间断空格）、\t、\r\n或多个 在页面上会原样渲染成塌陷/换行/错位。这不是前端“没写好CSS”，而是数据本身携带了不可见控制字符。
- 先用
console.log(JSON.stringify(str))确认空格类型：普通空格是" "，\u00a0会显示为"\u00a0"，\t显示为"\t" - 服务端未过滤的富文本字段（如CMS后台粘贴内容）最常混入
\u00a0和\u200b（零宽空格） - 不要只用
str.replace(/\s+/g, ' ')——它无法处理\u00a0，且会把换行也转成空格，破坏段落结构
JavaScript清洗API字符串的实用正则组合
针对不同场景选组合，不追求“一招通吃”：
- 仅清理首尾+合并中间连续空白（含
\u00a0）：str.replace(/^[\s\u00a0\u2000-\u200a\u2028\u2029\u202f\u205f\u3000]+|[\s\u00a0\u2000-\u200a\u2028\u2029\u202f\u205f\u3000]+$/g, '').replace(/[\s\u00a0\u2000-\u200a\u2028\u2029\u202f\u205f\u3000]{2,}/g, ' ') - 保留换行但清理其他空白（适合地址、简介类字段）：
str.replace(/[\u00a0\u2000-\u200a\u2028\u2029\u202f\u205f\u3000]/g, ' ').replace(/ {2,}/g, ' ').trim() - 彻底扁平化（所有空白变单空格，含换行）：
str.replace(/[\s\u00a0\u2000-\u200a\u2028\u2029\u202f\u205f\u3000]+/g, ' ').trim()
后端传参时就该过滤，而不是前端补救
如果API由你控制，清洗动作必须前置。前端清洗只是兜底，不能替代服务端校验：
- Python（FastAPI/Flask）用
re.sub(r'[\s\u00a0\u2000-\u200a\u2028\u2029\u202f\u205f\u3000]+', ' ', s).strip() - Node.js（Express）用
s.replace(/[\s\u00a0\u2000-\u200a\u2028\u2029\u202f\u205f\u3000]+/g, ' ').trim() - 数据库层（MySQL）入库前用
TRIM(REPLACE(REPLACE(col, '\u00a0', ' '), '\t', ' '))，但注意\u00a0需用UNHEX('C2A0')表示
遇到 从HTML实体变成真实空格怎么办
这是典型的数据被双重转义：服务端把\u00a0转成 ，前端又用innerHTML或v-html渲染，导致显示为字面量 而非空格。
立即学习“前端免费学习笔记（深入）”；
- 检查API响应体是否含
&不是&），说明后端做了多余的HTML转义 - 避免用
innerHTML插入API文本，改用textContent或框架的v-text/{...}插值 - 若必须解析HTML实体，用
DOMParser比正则更可靠：new DOMParser().parseFromString(' ', 'text/html').documentElement.textContent
\u200b或\ufeff（BOM），它们看不见、搜不到、也不触发\s匹配——得单独加到正则里，或者用str.normalize('NFKC')预处理。 
