How to use the html table to json converter
- Paste your HTML table markup into the text area.
- Toggle Pretty print if you want indented JSON or uncheck it for a compact single line.
- The JSON array appears automatically below as you type.
- Copy the result and use it in your application or API.
How the conversion works
The converter uses a hand-written tokenizer to parse the HTML string without relying on the browser DOM. It scans for tags, attributes, comments, and raw text blocks like <script> and <style>. Once the token stream is built, the parser locates the first <table> element and walks through its rows.
If the first row contains <th> cells, their decoded text content becomes the object keys. If every cell in the first row is a <td>, the tool generates default keys named col_0, col_1, and so on. Each subsequent row maps its cell values to those keys. Missing cells at the end of a row are filled with empty strings.
Handling HTML entities and special characters
Cell text often contains HTML entities such as &, <, >, ", and numeric references like ' or '. The built-in entity decoder resolves all of these before placing the text into the JSON output. This means your resulting JSON contains plain characters rather than escaped markup sequences.
For example, a cell containing <div> will appear in the JSON as <div>. The final JSON string itself is properly escaped according to JSON rules, so quotes and backslashes inside cell values will not break the structure.
Example input and output
Consider this simple markup:
| Input HTML | Output JSON |
|---|---|
<table><tr><th>City</th><th>Pop</th></tr><tr><td>Oslo</td><td>700000</td></tr></table> | [{"City":"Oslo","Pop":"700000"}] |
The header row provides the keys "City" and "Pop", and the data row supplies the values. The result is a standard JSON array containing one object per data row.
When to use JSON instead of CSV
Converting an html table to json is ideal when your downstream system expects structured objects, such as a REST API, a NoSQL database, or a JavaScript application. JSON preserves key-value relationships natively, making it easier to work with programmatically than flat delimited text.
If you need a flat file for spreadsheet software or bulk database imports, converting to html table to csv might be more appropriate. For stripping markup entirely and keeping only the readable text, the html to text tool handles that task. You can also html minify your source markup before processing it to remove unnecessary whitespace.
Limitations and edge cases
This converter processes the first <table> element found in the input. If your document contains multiple tables, extract the one you need first. Nested tables are flattened: inner table tags are treated as part of the parent cell's text content.
Cells with colspan or rowspan keep their value in the first position they cover and the other covered positions are empty strings, so later cells stay in the right column. If a row has more cells than the header row, the extra columns get generated keys such as col_2 instead of being dropped. Void elements such as <br> and <img> inside cells are ignored, and only text nodes contribute to the cell value.
Worked examples
| Example | Input | Result |
|---|---|---|
| Simple two-column table | HTML table markup: <table><tr><th>Name</th><th>Age</th></tr><tr><td>Alice</td><td>30</td></tr><tr><td>Bob</td><td>25</td></tr></table>; Pretty print: yes | [ / { / "Name": "Alice", / "Age": "30" / }, / { / "Name": "Bob", / "Age": "25" / } / ] |
| Table without headers | HTML table markup: <table><tr><td>A</td><td>B</td></tr><tr><td>C</td><td>D</td></tr></table>; Pretty print: no | [{"col_0":"A","col_1":"B"},{"col_0":"C","col_1":"D"}] |
| Table with attributes and entities | HTML table markup: <table class="data"><thead><tr><th>Item & Price</th></tr></thead><tbody><tr><td><Widget></td></tr></tbody></table>; Pretty print: yes | [ / { / "Item & Price": "<Widget>" / } / ] |
FAQ
Does this tool upload my HTML to a server?
No. The parsing and conversion happen entirely in your browser using JavaScript. Your data never leaves your device.
What happens if my table has no header row?
If the first row uses td elements instead of th, the converter assigns automatic column names like col_0, col_1, and so on.
Are HTML entities decoded in the JSON output?
Yes. Entities such as & and ' are converted to their actual characters before being placed into the JSON string.
Can I convert multiple tables at once?
The tool extracts the first table element it finds. To convert multiple tables, process them one at a time by pasting each separately.
Does it handle colspan and rowspan?
Partly. The value is kept once, in the first cell it covers, and the covered positions are empty strings so the columns line up. The value is not repeated.
Why use this instead of a generic html to json converter?
A dedicated html table to json converter understands tabular structure, mapping headers to keys and rows to objects. Generic converters produce deeply nested trees that require extra processing to flatten into usable arrays.