Převodník HTML Tabulky na JSON/CSV

Co je tento nástroj?

Webové stránky často zobrazují data uvnitř elementu HTML <table> — ceník, statistická stránka, stažený výpis — ale takový kód není přímo použitelný v kódu ani v tabulkovém procesoru. Tento nástroj zpracuje vložený kód <table>, přečte řádek záhlaví (z <thead>/<th>, nebo z prvního <tr>, pokud <thead> chybí), namapuje buňky každého následujícího řádku na tato záhlaví a vygeneruje pole objektů JSON nebo soubor CSV.

Funguje i opačně: vložte pole objektů JSON nebo text CSV a nástroj vygeneruje správně strukturovanou HTML tabulku s <thead> pro záhlaví sloupců a <tbody> pro řádky dat, připravenou vložit na webovou stránku nebo do CMS.

Vše běží pomocí vestavěného DOMParseru prohlížeče — žádné HTML se neposílá na server, takže je bezpečné nástroj používat i s vloženým obsahem, který obsahuje interní nebo citlivá data.

Zdroj: struktura tabulky vychází z definice elementu table ve WHATWG HTML Living Standard.

Proč ho používat?

• Obousměrný převod — HTML tabulka na JSON, HTML tabulka na CSV a JSON/CSV zpět na čistý kód HTML tabulky.
• Automatická detekce záhlaví — funguje s kódem <thead>/<th> i s prostým prvním <tr> použitým jako řádek záhlaví.
• Žádné kopírování nejdřív do tabulkového procesoru — přejděte přímo z kódu tabulky na strukturovaná data.
• Generuje správně escapovaný HTML výstup, takže speciální znaky jako < a & ve vašich datech tabulku nerozbijí.
• 100% zpracování na straně klienta — HTML, které vložíte (třeba z interní stránky nebo administrace), nikdy neopustí váš prohlížeč.

Jak se používá

1. Pro převod HTML tabulky: vložte kód <table>...</table> do prvního pole a klikněte na "Convert to JSON" nebo "Convert to CSV".
2. Zkontrolujte výstup a poté ho zkopírujte, nebo klikněte na odkaz ke stažení souboru.
3. Pro vygenerování HTML tabulky: vložte pole JSON nebo text CSV do druhého pole.
4. Klikněte na "Convert to HTML table" a zkopírujte vygenerovaný kód na svou stránku nebo do CMS.

Příklad

Vstup

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

Výstup

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

Buňky prvního řádku se stanou klíči objektu; každý následující řádek se stane jedním prvkem pole s hodnotami převzatými jako text.

Praktické tipy

• Extrakce dat z tabulky na webové stránce: zobrazte zdrojový kód stránky nebo zkontrolujte element, zkopírujte kód <table>...</table> a vložte ho sem místo ručního přepisování dat.
• Publikování odpovědi API jako čitelné tabulky na webu nebo v CMS: vložte pole JSON do druhého pole a zkopírujte vygenerované HTML přímo do bloku rich-text nebo HTML na vaší stránce.
• Pokud tabulka používá <div> nebo CSS grid layout místo skutečného kódu <table>, tento nástroj ji nedokáže zpracovat — zdrojová stránka musí používat skutečné značky HTML tabulky.

Proč záleží na detekci záhlaví

Tabulka bez jasného řádku záhlaví je nejednoznačná — každý navazující nástroj potřebuje vědět, který řádek definuje názvy sloupců, než dokáže zbylé řádky proměnit ve strukturované záznamy. Tento nástroj řeší tuto nejednoznačnost stejně jako prohlížeče a většina scraperů: nejprve hledá explicitní sekci <thead>, a teprve když <thead> chybí, vezme jako záhlaví první viditelný řádek. Díky tomu zůstává převod předvídatelný i u ručně psaného nebo staženého kódu tabulky, který vynechává sémantičtější značky.

Časté dotazy