我如何以易于阅读(供人类阅读)的格式显示JSON?我主要寻找缩进和空白,甚至是颜色/字体样式等。
当前回答
出于调试目的,我使用:
console.debug("%o", data);
https://getfirebug.com/wiki/index.php/Console_APIhttps://developer.mozilla.org/en-US/docs/DOM/console
其他回答
您可以使用JSON.stringify(您的对象,null,2)第二个参数可以用作替换函数,将key和Val作为参数。如果您想修改JSON对象中的某些内容,可以使用此函数。
更多参考:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify
要使用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>";
}
);
}
您可以使用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})})”
1行代码(无颜色)中的快速易读JSON输出:
document.documentElement.innerHTML='<pre>'+JSON.stringify(obj, null, 2)+'</pre>';
这是给Laravel的,CodeigniterHtml:<pre class=“jsonPre”></pre>
Controller:从控制器返回JSON值,如下所示
返回json_encode($data,json_PRETTY_PRINT);
在脚本中:<script>$('.jsonPre').html(结果)</脚本>
结果将是