JavaScript 漂亮打印 JSON
Valentine Kagwiria
2023年1月30日
2021年4月29日
-
在 JavaScript 中使用
JSON.stringify()
漂亮地打印 JSON - 突出显示 JSON 语法
-
在 JavaScript 中使用
JSON.parse()
漂亮地打印 JSON - 使用 JSON 数组
本文概述了如何在 JavaScript 中漂亮地打印 JSON。
在 JavaScript 中使用 JSON.stringify()
漂亮地打印 JSON
JSON.stringify()
参数允许内容以漂亮的方式显示,并允许用户设置适合其可读性的间距。
你可以通过如下设置字符串变量来实现。
var prettyString = JSON.stringify(obj, null, 2); // spacing level = 1.5
突出显示 JSON 语法
如果需要突出显示 JSON 语法,则需要创建一个函数并包含正则表达式代码。
function prettyString(json) {
if (typeof json != 'string') {
json = JSON.stringify(json, undefined, 2);
}
json = json.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>');
return json.replace(/("(\\u[a-zA-Z0-9]{4}|\\[^u]|[^\\"])*"(\s*:)?|\b(true|false|null)\b|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?)/g, function (match) {
var str1 = 'number';
if (/^"/.test(match)) {
if (/:$/.test(match)) {
str1 = 'key';
} else {
str1 = 'string';
}
} else if (/true|false/.test(match)) {
str1 = 'boolean';
} else if (/null/.test(match)) {
str1 = 'null';
}
return '<span class="' + str1 + '">' + match + '</span>';
});
}
在 JavaScript 中使用 JSON.parse()
漂亮地打印 JSON
上面的方法使用 json.stringify()
,并且在 JSON 对象上效果很好,但在 JSON 字符串上效果不佳。要打印出漂亮的 JSON 字符串,你需要先将其转换为对象。
var string1 = '{"program":"code"}';
var prettyPrint = JSON.stringify(JSON.parse(string1), null, 2);
确保将字符串包装在 HTML 标签 <pre>
和 </pre>
中,以便可以正确显示。
使用 JSON 数组
另外,你可以在 JavaScript 中使用 JSON 数组。它很简单,不需要额外的计算,这可能会使程序变慢,特别是在重复几次时。
例如:
JSON.stringify(jsonobj,null,'\t')
这也应在 <pre>
和 </pre>
标签中使用。