HTML Tabel naar JSON/CSV Converter

Wat is deze tool?

Webpagina's tonen gegevens vaak binnen een HTML <table>-element — een prijzenpagina, een statistiekenpagina, een gescrapete lijst — maar die markup is niet direct bruikbaar in code of een spreadsheet. Deze tool parseert de geplakte <table>-markup, leest de kopregel (uit <thead>/<th>, of de eerste <tr> als er geen <thead> is), koppelt de cellen van elke volgende rij aan die koppen, en levert een JSON-array van objecten of een CSV-bestand op.

Het werkt ook andersom: plak een JSON-array van objecten of CSV-tekst, en de tool genereert een correct gestructureerde HTML-tabel met een <thead> voor de kolomkoppen en een <tbody> voor de gegevensrijen, klaar om in een webpagina of CMS te plakken.

Alles draait met de ingebouwde DOMParser van de browser — er wordt geen HTML naar een server gestuurd, dus het is veilig te gebruiken met geplakte inhoud die interne of gevoelige gegevens bevat.

Bron: tabelstructuur volgt de WHATWG HTML Living Standard-definitie van het table-element.

Waarom gebruiken?

• Tweerichtingsconversie — HTML-tabel naar JSON, HTML-tabel naar CSV, en JSON/CSV terug naar nette HTML-tabelmarkup.
• Automatische koppendetectie — werkt met <thead>/<th>-markup of een gewone eerste <tr> die als kopregel gebruikt wordt.
• Niet eerst in een spreadsheet plakken — ga rechtstreeks van tabelmarkup naar gestructureerde gegevens.
• Genereert correct geëscapte HTML-uitvoer, zodat speciale tekens zoals < en & in je gegevens de tabel niet breken.
• 100% client-side — de HTML die je plakt (mogelijk afkomstig van een interne pagina of beheerpaneel) verlaat nooit je browser.

Hoe te gebruiken

1. Om een HTML-tabel om te zetten: plak de <table>...</table>-markup in het eerste vak, klik dan op "Naar JSON" of "Naar CSV".
2. Bekijk de uitvoer, kopieer die dan of klik op de downloadlink om het bestand op te slaan.
3. Om een HTML-tabel te genereren: plak een JSON-array of CSV-tekst in het tweede vak.
4. Klik op "Naar HTML-tabel" en kopieer de gegenereerde markup naar je pagina of CMS.

Voorbeeld

Invoer

<table><tr><th>naam</th><th>leeftijd</th></tr><tr><td>Alice</td><td>30</td></tr></table>

Uitvoer

[{"naam":"Alice","leeftijd":"30"}]

De cellen van de eerste rij worden de objectsleutels; elke volgende rij wordt één array-element met waarden als tekst.

Praktische tips

• Gegevens uit een tabel op een webpagina halen: bekijk de paginabron of inspecteer het element, kopieer de <table>...</table>-markup, en plak die hier in plaats van de gegevens handmatig over te typen.
• Een API-respons publiceren als leesbare tabel op een site of in een CMS: plak de JSON-array in het tweede vak en kopieer de gegenereerde HTML direct in het rich-text- of HTML-blok van je pagina.
• Als een tabel <div>- of CSS-grid-layout gebruikt in plaats van echte <table>-markup, kan deze tool die niet parseren — de bronpagina moet echte HTML-tabeltags gebruiken.

Waarom koppendetectie belangrijk is

Een tabel zonder duidelijke kopregel is dubbelzinnig — elke vervolgtool moet weten welke rij de kolomnamen bepaalt voordat hij de overige rijen kan omzetten in gestructureerde records. Deze tool lost die dubbelzinnigheid op zoals browsers en de meeste scrapers dat doen: hij zoekt eerst naar een expliciete <thead>-sectie, en valt pas terug op het behandelen van de eerste zichtbare rij als kopregel wanneer er geen <thead> aanwezig is. Dat houdt de conversie voorspelbaar, zelfs voor handgeschreven of gescrapete tabelmarkup die de meer semantische tags overslaat.

Veelgestelde vragen