How do I convert HTML to a JSON structure?

Paste your HTML snippet into the HTML Structure mode. The tool uses the browser's native DOMParser to parse the HTML and then serialises the DOM tree to a JSON object — with tag name, attributes, text content and children for each element.

Does the HTML to JSON converter work with scraped web pages?

The browser-based converter works best with HTML snippets that are well-formed — exported from a CMS, copied from a data source, or pasted from an email. For scraping full web pages, use the Code Snippets mode to get Python or Node.js code that runs server-side without CORS restrictions.

HTML to JSON Converter — Extract Tables Online Free

HTML to JSON — 3 modes 100% client-side

HTML input

Header row

Type coercion

Multiple tables

Tree depth

Formatting

JSON ready

Three ways to convert HTML to JSON

Choose the mode that matches your data source and use case.

Mode 1 — HTML Table

Paste any HTML containing a <table> element and get a JSON array of objects. Column names come from the header row. Multiple tables are supported. Best for data copied from websites, reports, spreadsheet exports and email newsletters.

Input

<table>
  <tr><th>name</th><th>age</th></tr>
  <tr><td>Alice</td><td>30</td></tr>
</table>

Output

[{"name":"Alice","age":30}]

Mode 2 — HTML Structure

Serialise any HTML snippet to a JSON tree. Each element becomes an object with tag, attrs, text and children fields. Best for analysing HTML structure, extracting metadata, or converting component markup to a JSON representation.

Input

<div class="card">
  <h2>Title</h2>
  <p>Body text</p>
</div>

Output

{"tag":"div","attrs":
{"class":"card"},
"children":[...]}

Mode 3 — Code Snippets

Get ready-to-run code for parsing HTML to JSON in Python (BeautifulSoup, requests+lxml), Node.js (cheerio) or the browser (DOMParser). Covers table extraction, full DOM parsing and CSS selector-based extraction. Copy and run without any modification.

Python output

from bs4 import BeautifulSoup
soup = BeautifulSoup(html, 'html.parser')
rows = soup.select('table tr')

What works well — and what doesn't

Be aware of these constraints before using the browser-based converter.

Best results: HTML copied from a web page (Ctrl+U → copy), exported from a CMS, generated by a reporting tool, or pasted from an email template. These sources produce well-formed HTML with predictable structure.

JS-rendered pages: If the HTML you want to parse is generated by JavaScript (React, Angular, Vue apps), the browser converter sees the source HTML before rendering — not the final DOM. Use the Code Snippets mode with a headless browser (Playwright, Puppeteer) instead.

External URLs: The browser converter cannot fetch URLs — CORS restrictions prevent cross-origin requests without a server proxy. Use the Python or Node.js snippets from Mode 3 to fetch and parse external pages from your own environment.

When do you need HTML to JSON?

The four most common workflows where HTML data needs to become JSON.

Web table extraction

Wikipedia tables, financial data pages, sports statistics, price comparison sites — all present data as HTML tables. Mode 1 extracts the table as a JSON array instantly — ready to process, save or import into a database without writing any parsing code.

CMS and email migration

Migrating content from WordPress, Drupal, Mailchimp or any CMS often involves converting HTML content to structured JSON for import into a headless CMS, a database or a static site generator. Mode 2 gives you the structural JSON representation of any HTML snippet.

Web scraping pipelines

Building a scraper to extract product data, job listings, news articles or any structured content from HTML pages? Mode 3 gives you the exact Python or Node.js code to paste into your script — with the right library imports, error handling and JSON output.

n8n and automation workflows

n8n, Zapier and Make workflows often receive HTML content from webhooks, email parsers or HTTP requests. Converting the HTML snippet to JSON lets you use standard JSON manipulation nodes instead of custom HTML parsing — paste the HTML into Mode 1 to get the JSON structure your workflow needs.

Related tools

All spreadsheets & documents tools

HTML parsed by your
own browser. No upload.

The table and structure modes use the browser's native DOMParser — the same engine that renders every web page you visit. Your HTML is parsed locally, the DOM is traversed in JavaScript, and the JSON is built entirely in memory. Nothing leaves your device.

The code snippets are generated from your language and target selection — no API call, no server round-trip. Each snippet is production-ready: correct imports, error handling, and JSON serialisation — copy and run directly in your environment.

Native DOMParser

Uses the browser's built-in HTML parser — the most standards-compliant and battle-tested option available. No external library needed.

Multi-table support

HTML with multiple tables produces multiple JSON arrays — extract all tables at once or just the first one.

Honest about limits

JS-rendered pages and external URLs are clearly flagged — with the correct tool (headless browser, server-side scraper) recommended for each case.

52 tools, always free

No watermarks, no account. Funded by non-intrusive display advertising only.

Frequently asked questions

Common questions about converting HTML to JSON.

How do I convert an HTML table to JSON?

Select the HTML Table mode, paste your HTML containing a table element, and click Extract. The tool detects the header row automatically (from thead or the first tr), and outputs a JSON array of objects with column names as keys and cell values as values.

How do I parse HTML to JSON in Python?

Use BeautifulSoup: pip install beautifulsoup4, then from bs4 import BeautifulSoup; soup = BeautifulSoup(html, 'html.parser'). Select the Code Snippets mode and choose Python (BeautifulSoup) to get a complete, ready-to-run script for table extraction or full DOM parsing.

How do I parse HTML to JSON in JavaScript?

In Node.js use cheerio: npm install cheerio, then const $ = require('cheerio'). In the browser use the native DOMParser: const doc = new DOMParser().parseFromString(html, 'text/html'). Select Code Snippets mode and choose Node.js or Browser to get the complete snippet.

Does it work with HTML copied from a website?

Yes, for static HTML pages. Right-click a table on any website, choose "Inspect", copy the outer HTML of the table element, and paste it into Mode 1. For pages where content is loaded by JavaScript (React, Angular apps), use the Code Snippets mode with Playwright or Puppeteer instead.

Is the HTML to JSON converter free?

Yes, completely free. No account required. JSONSwitcher is funded by non-intrusive display advertising.

Are merged cells (colspan and rowspan) supported?

Yes. A cell that spans several columns or rows is repeated in every position it covers, so the following values stay in their correct columns.

Convert HTML to JSONTables, structure,or parse in code.