Skip to content

Edward1992/json-browse

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

19 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

json-browse

npm version Dependency Status Licence

NPM

json-browse is a jQuery plugin to easily browse and highlight your JSON.

  • Syntax highlighting
  • Collapse and expand child nodes on click
  • Clickable links
  • Easily readable and minimal DOM structure

demo page!

Usage

Import jquery.json-browse.js and jquery.json-browse.css in your application.

Then just call the jsonBrowse() method passing in an object:

<pre id="json-renderer" class="json-body"></pre>
var data = {
  "foobar": "foobaz"
};
$('#json-renderer').jsonBrowse(data);

Options

The jsonBrowse method accepts an optional options hash as a second argument:

Option Type Default Description
collapsed boolean false All nodes are collapsed.
withQuotes boolean false All JSON keys are surrounded with double quotation marks

Example:

$('#json-renderer').jsonBrowse(data, {collapsed: true, withQuotes: true});

About

jQuery plugin to easily browse and highlight your JSON

Resources

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 58.8%
  • HTML 25.9%
  • CSS 15.3%