html css返回行↵

Question

我有来自服务器的JSON响应，在这个数据中，我在文本中有一个“返回行”。

{text: "I am in the first line ↵ and I am in the second line"}

但是当我在html中显示它时，没有显示“返回行”。

"I am in the first line and I am in the second line"

而不是：

I am in the first line
and I am in the second line

使用HTML或CSS（可能是JavaScript）的任何解决方案？

谢谢！

Answer 1

您可以使用其他用户建议的HTML换行符替换换行符。

const parse = s => s.replace(/[␤␍␊↵⏎]+/g, '\n');
const nl2br = s => s.replace(/\n/g, '<br>');

var data = {
  "text" : "I am in the first line ↵ and I am in the second line"
};

document.getElementById('display').innerHTML = nl2br(parse(data.text));

<div id="display"></div>

Answer 2

添加此css类解决问题！

white-space: pre-line;