json格式的数据如何显示到html中 利用pre code 出现如下问题

Question

json格式的数据如何显示到html中

如图所示怎么把控制台的数据格式显示到上面html页面中

怎么解决复制时pre标签重复问题呢

Answer 1

pre和code标签。

来个demo,点击看预览和代码
https://jsfiddle.net/sy4ovuj4/

Answer 2

chrome装一个jsonview插件，直接打印json数据。
譬如php直接

echo json_encode($data);

为了保险可以在代码开头写一个

header('content-type:application/json;charset=utf-8');