当前位置: 首页 > 工具软件 > json2html > 使用案例 >

html中JSON格式化输出

颜君浩
2023-12-01

今天做一个API后台管理系统新增了日志模块,我是把操作的数据直接存入mongo数据库的,mongo是存入的json格式但是我想输出存入的操作详情到页面一直是很乱的格式,我想按照mongo的格式输出找了很久找到了解决方法:

JSON.stringify(jsObj, null, "\t"); // 缩进一个tab
JSON.stringify(jsObj, null, 4);    // 缩进4个空格

另外还要在最外层加上<pre>标签

在展示代码的时候,你需要选择究竟是否折行。如果你选择折行,幸运地,你可以使用为<pre>标签提供的独一无二的样式来保留空白同时折行,如同下面这样:

pre {
  white-space: pre-wrap;
}

如果你不想折行,你就不用像上面那样做,不过你得考虑如果一行太长了怎么办。太长的行可能会撑开固定宽度的容器或者超出容器范围。要避免这个,我建议你加上横向滚动条:

pre {
  overflow-x: auto;
}

 

 

 

 

 

 类似资料: