HTML to JSON Converter

Turn HTML into a JSON tree of tags, attributes, text and children that code can walk.

HTML
JSON
Runs locally in your browser

About the HTML to JSON Converter

Sometimes you want the structure of a page as data: to assert on it in a test, to feed it to a template engine, or to inspect what a scraper will see. This converter parses the HTML with the browser's own parser and emits a JSON tree where every element becomes an object with its tag, an attributes map when it has any, and either a text string (for elements that contain only text) or a children array.

Whitespace-only text nodes are dropped and text is trimmed by default so the tree reflects content rather than indentation; untick the option to keep text exactly. Comments are omitted unless you ask for them. A fragment without an <html> element produces the fragment's top-level nodes; a full document produces one root object for html.

This is a different job from HTML Table to JSON, which turns table rows into records. For the reverse, no exact tool exists because JSON has many possible HTML renderings; the JSON to HTML Table covers the common tabular case.

How to use

  1. Paste HTML or a fragment on the left.
  2. Choose whether to trim whitespace text and keep comments.
  3. Copy the JSON tree.

Common questions

How are attributes represented?
As an attributes object on the element, with attribute names as keys and their string values.
Why is the text of a paragraph split into children?
When an element contains both text and child elements, each part becomes a child in order, so nothing is lost. Elements with only text get a single text field.
Does it repair broken HTML?
It uses the browser parser, which applies the standard recovery rules, so the JSON reflects the DOM a browser would build.