A simple way to inspect JSON
JavaScript CSS
Latest commit e6bec9f Jul 8, 2014 @josiahsprague josiahsprague Merge pull request #8 from SparkartGroupInc/fix-collapse-storage
fix reference to path attribute
Failed to load latest commit information.
lib fix reference to path attribute Jul 8, 2014
inspector-json.js fix reference to path attribute Jul 8, 2014
package.json add testling config Oct 28, 2013


Inspector JSON

Explore JSON in style.


Inspector JSON is a javascript library for creating "inspectable" representations of JSON, much like the inspection features in web browsers like Google Chrome, Firefox, and Opera. It allows you to collapse/expand arrays and objects, and can even remember the state of the inspector between pageloads.

browser support


NOTE: You must include inspector_json.css for the inspector to be properly styled.

The inspector is started by creating a new InspectorJSON instance. If you pass the json option, or the element provided has a JSON string inside of it, Inspector JSON will automatically render that JSON.

var inspector = new InspectorJSON({
    element: 'json',
    json: '{"hello":"world"}'

You may also render new JSON at any time by using the view method:


Inspector JSON can be used as a standalone script, with Browserify, or with RequireJS.


Inspector JSON has a few configuration options, all of which are set in a configuration object passed when the inspector is instantiated. The options are as follows:

Option Type Default Purpose
element String or Element null The element the inspector should be rendered in. This must either be the ID of an element, or the element reference itself.
json String or Object null The JSON for the inspector to render. This must either be a valid JSON string, or an object representing valid JSON.
collapsed Boolean true Whether or not the tree will start collapsed
url String location.pathname The URL to be used for remembering the inspector's collapse state. By default this uses the page's current URL
var inspector = new InspectorJSON({
    element: 'json',
    json: '{"hello":"world"}',
    collapsed: false,
    url: '/json/inspector/'


Inspector JSON only makes two methods available at the moment:

inspector.view( json )

Views the JSON string/object passed.

inspector.view('{"string":"Hello World!","number":5,"boolean":true,"array":["one","two","three"],"object":{"key":"value","key2":"value2"}}');



Destroys the inspector.



Inspector JSON is available under the MIT License.