html读取json换行无效,前端Json换行显示

在 HTML 中，空格和换行符通常被忽略或折叠为单个空格。要在 HTML 中显示换行符，你可以使用 `<br>` 标签。

如果你想要在前端的 JSON 数据中显示换行符，则需要将换行符转换为 HTML 实体编码。比如，将 `\n` 转换为 `&#10;`，将 `\r` 转换为 `&#13;`。然后在 HTML 中使用 CSS 样式或 JavaScript 将这些实体编码转换为实际的换行符。

以下是一个示例代码，用于将 JSON 数据中的换行符转换为 HTML 实体编码，并在页面中显示：

<div id="json"></div>

<script>
  // 假设你的 JSON 数据如下
  const data = {
    "name": "John",
    "message": "Hello\nWorld!\nHow are you?"
  };

  // 将换行符转换为 HTML 实体编码
  const encodedData = JSON.stringify(data)
    .replace(/\n/g, '&#10;')
    .replace(/\r/g, '&#13;');

  // 在页面中显示 JSON 数据
  const jsonDiv = document.getElementById('json');
  jsonDiv.innerHTML = encodedData;
</script>

在上面的示例代码中，我们将 JSON 数据中的换行符替换为 HTML 实体编码，并将结果插入到一个 `<div>` 元素中。这样，页面就可以正确地显示换行符了。