Javascript JSON Highlighter
Inspired by (read: stolen from) Stackoverflow: JSON pretty print using JavaScript.
Therefore, all credit goes to Pumbaa80.
Try it on jsfiddle.
(fails in Chrome due to the "MIME type" error, but seems to work fine in FF 24)
Usage:
html:
<head>
...
<script type="text/javascript" src="js/jsonHighlighter.min.js"></script>
</head>
<body>
...
<pre id="HighlightOutput"></pre>
</body>
javascript:
var out = document.getElementById("HighlightOutput");
out.innerHTML = cope.Highlighter.highlight(jsonObject); // jsonObject is a regular JS object
...
out.innerHTML = cope.Highlighter.highlight(jsonString); // jsonString is a valid JSON String
with jQuery:
var out = $("#HighlightOutput");
out.html(cope.Highlighter.highlight(jsonObject); // jsonObject is a regular JS object
...
out.html(cope.Highlighter.highlight(jsonString); // jsonString is a valid JSON String
Options (optional):
- indent: indentation
- useTabs: use tab delimiter
Indent:
out.innerHTML = cope.Highlighter.highlight(jsonObject, {indent: 3}); // set indentation to 3 space characters
Tabs: (useTabs:true overrides indent)
out.innerHTML = cope.Highlighter.highlight(jsonObject, {indent: 3, useTabs: true}); // use tabs for indentation