liminfoHTML Table to JSON
Free web tool: HTML Table to JSON
About HTML Table to JSON
HTML Table to JSON converts an HTML table element into a JSON array of objects entirely in your browser. It uses the browser's native DOMParser API to parse the HTML input, locates the first table element, reads the first row as column headers (using th or td cells), then iterates through all remaining rows to build one JavaScript object per row, mapping each cell's text content to the corresponding header key. The result is formatted as pretty-printed JSON with 2-space indentation.
Data engineers, web scrapers, and developers who work with tabular data from web pages use this tool to rapidly extract structured data without writing a custom parser. Copy an HTML table from a webpage's source code, paste it into the tool, and receive a clean JSON array that can be used directly in a REST API, inserted into a database, or processed by a JavaScript application. No external libraries, no server calls, no data stored.
The tool validates the input before converting: it checks that a table element is present and that there are at least two rows (one header and one data row). If validation fails, a clear error message is shown. The output includes a copy-to-clipboard button for quick extraction of the JSON result. All processing uses the browser's own DOM APIs, making the parsing behavior identical to how a real browser would interpret the table markup.
Key Features
- Uses the native browser DOMParser API to parse HTML input — no third-party parsing library needed
- Automatically detects the first <table> element in the pasted HTML
- Reads th and td cells from the first row as column header keys for the JSON objects
- Maps each subsequent table row to a separate JSON object with header keys and cell text values
- Falls back gracefully — if a row has fewer cells than headers, missing keys use the col{n} fallback name
- Validates input: shows a clear error if no table is found or if the table has fewer than two rows
- Outputs formatted JSON with 2-space indentation for readability
- One-click copy of the JSON output to clipboard
Frequently Asked Questions
What kind of HTML input does this tool accept?
The tool accepts any HTML snippet containing a <table> element. You can paste a complete HTML page or just the table markup. It uses the browser's DOMParser to extract the first table it finds. The table must have at least two rows: one header row and one data row.
How does the tool determine the JSON keys?
The first row of the table is read as the header row. Each cell in that row — whether a <th> or <td> — becomes a key in the JSON objects. If a cell is empty, the key falls back to col0, col1, etc. based on its column index.
What happens if a data row has fewer cells than the header row?
If a data row has fewer cells than the header row, the missing columns are simply absent from that row's JSON object. The tool does not throw an error — it processes each cell that is present and maps it to the corresponding header key.
Can I convert a table with merged cells (colspan/rowspan)?
Merged cells (colspan and rowspan) are not explicitly handled. The DOMParser reads each cell individually as it appears in the DOM. A merged cell will be read as a single cell in its starting position. The output may not perfectly reflect complex spanning tables, so review the JSON for accuracy with such markup.
How do I get the HTML of a table from a webpage?
In your browser, right-click the table on the webpage and choose Inspect (or Inspect Element). In the developer tools, right-click the table node in the Elements panel and choose Copy > Copy outerHTML. Then paste that HTML into this tool.
What is the output format of the JSON?
The output is a JSON array of objects, formatted with JSON.stringify(data, null, 2) for 2-space indentation. Each object in the array represents one data row from the table, with keys taken from the header row and values taken from the corresponding cells as trimmed plain text strings.
Can I convert multiple tables from one HTML document?
Currently the tool converts only the first table found in the input HTML. If you need to convert multiple tables, paste each table separately and run the conversion for each one.
Is the output always an array?
Yes. The output is always a JSON array, even if the table has only one data row. Each element of the array is an object representing one row. This format is directly usable in REST APIs, databases, and most JavaScript data processing workflows.