HTML Table to JSON — Extract HTML Tables to JSON
Extract data from HTML tables to structured JSON. Auto-detects headers, handles nested tables, runs entirely in your browser. No uploads, no limits.
HTML Table to JSON
Extract data from HTML tables and convert to JSON. Auto-detects <thead> headers and <tbody> rows. Works entirely in your browser.
HTML tables are the closest thing the web has to a universal data grid: every spreadsheet export can produce one, every email client renders them, every CMS stores them, and every browser paints them in a predictable shape. JSON is the closest thing modern software has to a universal data interchange format: every web API returns it, every modern language parses it natively, every database ingests it. Converting between them is the standard way to extract tabular data from a web page and load it into something programmatic — a database, a spreadsheet, a charting library, or a test fixture.
The conversion is not as simple as it looks. HTML tables have a rich set of structural features — <thead>, <tbody>, <tfoot>, <th>, colspan, rowspan, scoped attributes — that the JSON output needs to flatten or preserve in a deliberate way. A naive conversion (just walk the rows and emit the cell text) loses the header structure and merges cells in unpredictable positions. A good conversion detects the header row, picks a sensible output shape, and treats merged cells as a deliberate signal rather than a parsing error. The tool handles all three: header detection, output shape selection, and merged cell policy are exposed as settings rather than baked into a single mode.
For a final hand-off: if the destination is a JavaScript data pipeline (a charting library, a data grid component, a test fixture), array-of-objects is the natural shape — each row becomes a typed object that downstream code can iterate. If the destination is a spreadsheet or a CSV import, array-of-arrays or the CSV converter is the better pick — JSON objects in spreadsheets require an extra import step. If the source is a complex table with merged headers, multi-level rows, or visual styling that carries meaning, no automated conversion will preserve the semantics perfectly — manual review is part of the workflow.
How to use
Paste an HTML table
Paste the full `<table>...</table>` block, or an HTML fragment containing one or more tables. The parser handles `<thead>`, `<tbody>`, `<th>`, `colspan`, and `rowspan` automatically.
Pick an output shape
Choose between array-of-objects (each row is a JSON object keyed by header), array-of-arrays (no header dependency), or a single object keyed by column index. Default is array-of-objects for the first table found.
Copy or download the JSON
Copy the JSON to your clipboard, or download it as a .json file. For multi-table input, each table becomes a top-level key in the output object when structured mode is selected.
Frequently asked
How are merged cells handled?
Cells with `colspan` or `rowspan` emit their value once in the position they appear and an empty string in the spanned positions. For tables where merged cells carry meaning (a category that spans multiple data rows), post-process the output to fill the empty positions with the previous non-empty value.
Does it pick the first table if there are multiple?
What happens with tables that have no header row?
Will it strip inline styles and classes?
Yes — only the cell text content is extracted. Inline styles, classes, IDs, and other attributes are discarded. If you need to preserve those (e.g., for a style-aware migration), the HTML-to-JSON general extractor is the right tool.
Does it handle nested tables?
Nested tables are flattened by default — the inner table's text becomes a child object or a serialized HTML string in the cell value. Switch to 'preserve nesting' mode to keep the inner table as a nested JSON array inside the cell, useful for complex data exports.
Limitations
- No CSS-based extractionThe tool reads table structure from HTML markup only. Tables built with CSS Grid or flexbox (semantically `<div>` elements styled to look like a table) are not detected — paste the underlying markup or convert the layout to a real `<table>` first.
- No image extractionImage cells are converted to their alt text or to an empty string if no alt is present. For tables with charts or thumbnails that need the image data, post-process the output with a tool that handles embedded images.
- Single encoding assumptionThe parser assumes UTF-8 input. HTML pages served as Latin-1 or Windows-1252 may produce mojibake; run the page through a charset-detection tool first if you see character corruption in the source.
Platform notes
- macOS
- Safari's Reader View extracts table content but loses structure. The browser tool is the right pick for HTML tables copied from emails, CMS exports, or scraped pages where the structure needs to land as parseable JSON.
- Windows
- Microsoft Edge's 'Save as PDF' or 'Print to PDF' loses the table semantics. The browser tool is the right pick when the source is HTML in an email or a CMS export and the destination is a JSON file for a data pipeline.
- Linux
- For command-line work, `python3 -c 'from bs4 import BeautifulSoup; ...'` handles the extraction. The browser tool is the right pick for HTML pasted from a chat, an email, or a documentation page where retyping into Python is impractical.
- Web
- Runs entirely client-side. Works offline once the page has loaded. Useful for ad-hoc extraction in restricted environments where command-line tools or a Python install are not available.