您可以使用console.dir（），这是console.log（util.inspect（））的快捷方式。（唯一的区别是它忽略了在对象上定义的任何自定义inspect（）函数。）

它使用语法高亮显示、智能缩进、从键中删除引号，并使输出尽可能漂亮。

const object = JSON.parse(jsonString)

console.dir(object, {depth: null, colors: true})

对于命令行：

cat package.json | node-e“process.stdin.pipe（newstream.Writeable（｛write:cchunk=>console.dir（json.parse（chunk），｛depth:null，colors:true｝）｝）”

如果您正在寻找一个漂亮的库来美化网页上的json。。。

Prism.js非常好。

http://prismjs.com/

我发现使用JSON.stringify（obj，undefined，2）获取缩进，然后使用prism添加主题是一个不错的方法。

如果通过ajax调用加载JSON，那么可以运行Prism的一个实用方法来美化

例如：

Prism.highlightAll()

出于调试目的，我使用：

console.debug("%o", data);

https://getfirebug.com/wiki/index.php/Console_APIhttps://developer.mozilla.org/en-US/docs/DOM/console

要使用Bootstrap在HTML中突出显示和美化它，请执行以下操作：

function prettifyJson(json, prettify) {
    if (typeof json !== 'string') {
        if (prettify) {
            json = JSON.stringify(json, undefined, 4);
        } else {
            json = JSON.stringify(json);
        }
    }
    return json.replace(/("(\\u[a-zA-Z0-9]{4}|\\[^u]|[^\\"])*"(\s*:)?|\b(true|false|null)\b|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?)/g,
        function(match) {
            let cls = "<span>";
            if (/^"/.test(match)) {
                if (/:$/.test(match)) {
                    cls = "<span class='text-danger'>";
                } else {
                    cls = "<span>";
                }
            } else if (/true|false/.test(match)) {
                cls = "<span class='text-primary'>";
            } else if (/null/.test(match)) {
                cls = "<span class='text-info'>";
            }
            return cls + match + "</span>";
        }
    );
}

这是给Laravel的，CodeigniterHtml：<pre class=“jsonPre”></pre>

Controller：从控制器返回JSON值，如下所示

返回json_encode（$data，json_PRETTY_PRINT）；

在脚本中：<script>$（'.jsonPre'）.html（结果）</脚本>

结果将是

这很好：

https://github.com/mafintosh/json-markup来自马芬托什

const jsonMarkup = require('json-markup')
const html = jsonMarkup({hello:'world'})
document.querySelector('#myElem').innerHTML = html

HTML

<link ref="stylesheet" href="style.css">
<div id="myElem></div>

样式表示例可在此处找到

https://raw.githubusercontent.com/mafintosh/json-markup/master/style.css