doc on github.io

json2html

show JSON in HTML. rows sampling, collapse/expand, etc.

---

Installation

• pip install json_to_html
• run : "json2html" or "python -mjson2html"

---

Examples

[yonghang@W5202860 json2html]$ curl -s walkerever.com/share/test/json/s6.json | qic
{
  "users": [
    {
      "userId": 1,
      "firstName": "Krish",
      "lastName": "Lee",
      "phoneNumber": "123456",
      "emailAddress": "krish.lee@learningcontainer.com"
    },
    {
      "userId": 2,
      "firstName": "racks",
      "lastName": "jacson",
      "phoneNumber": "123456",
      "emailAddress": "racks.jacson@learningcontainer.com"
    },
    {
      "userId": 3,
      "firstName": "denial",
      "lastName": "roast",
      "phoneNumber": "33333333",
      "emailAddress": "denial.roast@learningcontainer.com"
    },
    {
      "userId": 4,
      "firstName": "devid",
      "lastName": "neo",
      "phoneNumber": "222222222",
      "emailAddress": "devid.neo@learningcontainer.com"
    },
    {
      "userId": 5,
      "firstName": "jone",
      "lastName": "mac",
      "phoneNumber": "111111111",
      "emailAddress": "jone.mac@learningcontainer.com"
    }
  ]
}

---

conver to plain HTML

[yonghang@W5202860 json2html]$ curl -s walkerever.com/share/test/json/s6.json | python -mjson2html

users

userId 1 firstName Krish lastName Lee phoneNumber 123456 emailAddress krish.lee@learningcontainer.com userId 2 firstName racks lastName jacson phoneNumber 123456 emailAddress racks.jacson@learningcontainer.com userId 3 firstName denial lastName roast phoneNumber 33333333 emailAddress denial.roast@learningcontainer.com userId 4 firstName devid lastName neo phoneNumber 222222222 emailAddress devid.neo@learningcontainer.com userId 5 firstName jone lastName mac phoneNumber 111111111 emailAddress jone.mac@learningcontainer.com </td>

---

with -Z option

[yonghang@W5202860 json2html]$ curl -s walkerever.com/share/test/json/s6.json | python -mjson2html -Z

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script type="text/javascript"> $(document).ready(function () { $('tr.parent') .css("cursor", "pointer") .attr("title", "Click to expand/collapse") .click(function () { $(this).siblings('.child-' + this.id).toggle(); }); $('tr[@class^=child-]').hide().children('td'); }); </script>

D(1)

users

L(5) userId 1 firstName Krish lastName Lee phoneNumber 123456 emailAddress krish.lee@learningcontainer.com userId 2 firstName racks lastName jacson phoneNumber 123456 emailAddress racks.jacson@learningcontainer.com userId 3 firstName denial lastName roast phoneNumber 33333333 emailAddress denial.roast@learningcontainer.com userId 4 firstName devid lastName neo phoneNumber 222222222 emailAddress devid.neo@learningcontainer.com userId 5 firstName jone lastName mac phoneNumber 111111111 emailAddress jone.mac@learningcontainer.com </td>