如何通过JavaScript或CSS去除文本前后的多余空白字符

根据你的实际需求可以选择两种实现：

• 可接受内部连续空格合并为1个，仅保留内部换行：使用 white-space: pre-line 即可，该属性会自动忽略元素首尾的所有空白，同时保留文本内部的换行，兼容性覆盖所有现代浏览器及IE8+，修改你的代码如下：

.demo {
  white-space: pre-line;
  background: #eee;
}

• 需要保留内部所有连续空格和换行、仅修剪首尾空白：使用CSS新属性 text-trim: start end 搭配原有 white-space: pre 即可，代码如下：

.demo {
  white-space: pre;
  text-trim: start end;
  background: #eee;
}

该属性2023年后发布的主流浏览器版本均已支持，对兼容性要求不高的场景可直接使用。

如果需要覆盖全版本浏览器，实现逻辑非常简单，直接对p标签的文本内容执行trim操作即可：

// 可根据实际需求修改选择器
document.querySelectorAll('p.demo').forEach(item => {
  // trim() 会清除首尾所有空格、换行、制表符，不改动文本内部内容
  item.textContent = item.textContent.trim()
})

内容的提问来源于stack exchange，提问作者WEI A