Author: | LorDOniX |
---|---|
Views Total: | 19,205 views |
Official Page: | Go to website |
Last Update: | February 29, 2020 |
License: | MIT |
Preview:

Description:
A super lightweight, pure JavaScript JSON formatter / viewer which helps render JSON objects just like a collapsible tree view.
How to use it:
Load the following JS and CSS files into your html page.
<script src="json-viewer.js"></script> <link rel="stylesheet" href="json-viewer.css">
Create an element to place the formatted JSON objects.
<div id="json"></div>
Create a new JSONViewer instance.
var jsonViewer = new JSONViewer();
Append the instance to the DIV element you just created.
document.querySelector("#json").appendChild(jsonViewer.getContainer());
Format and beautify your JSON data using the showJSON() method. Available parameters:
- json: json Input value
- maxLvl: Process only to max level, where 0..n, -1 unlimited
- colAt: Collapse at level, where 0..n, -1 unlimited
jsonViewer.showJSON(json, maxLvl, colAt);
Changelog:
02/29/2020
- CSS update
03/19/2019
- fixed xss vulnerability
The simplest, easiest way to display of a JSON object as a tree I could find. Most other implementations rely on a particular syntax for the tree. This one is flexible, and elegant. Many thanks to Roman Makudera!
You are EXCELLENT!!!
Outstanding!
No more than 5 minutes to integrate it into my app, and it’s exactly what I was looking for.
Really great work, thanks for doing this!