Conversor de HTML Table to JSON

Cole uma tabela HTML ou um trecho de página e converta cada tabela em JSON e CSV no seu navegador. A marcação que você cola fica no seu dispositivo.

O Conversor de HTML Table to JSON analisa a marcação que você cola inteiramente no seu navegador. O HTML da tabela e o JSON ou CSV que ele produz ficam no seu dispositivo e nunca são enviados à ArrayKit.

Abrir o Formatador JSON

Sobre Tabela HTML para JSON

O Conversor de HTML Table to JSON transforma qualquer <table> colada — ou um trecho de página inteiro cheio delas — em um array JSON limpo de objetos-linha e um CSV correspondente. Cada célula de cabeçalho vira uma chave, então uma linha como <td>Ada</td><td>Admin</td> é lida como { "Name": "Ada", "Role": "Admin" }. Ele entende thead e tbody, usa células th como cabeçalhos, sintetiza rótulos column_1, column_2 quando uma tabela não tem nenhum, e expande colspan e rowspan para que toda linha se alinhe em uma grade retangular. Quando a marcação contém várias tabelas você pode alternar entre elas e copiar cada resultado separadamente. É feito para extrair um relatório, mover uma folha de especificações para código ou popular um fixture a partir de documentação. O HTML que você cola é analisado localmente e nunca sai do seu dispositivo.

Recursos

Como usar Tabela HTML para JSON

  1. Cole uma <table> HTML ou um trecho de página que contenha uma ou mais tabelas
  2. Alterne entre JSON e CSV com o seletor de formato
  3. Se várias tabelas forem encontradas, escolha uma no seletor de Tabela
  4. Copie a saída ou baixe-a como um arquivo .json ou .csv

Exemplo

Entrada

<table><thead><tr><th>Name</th><th>Role</th></tr></thead><tbody><tr><td>Ada</td><td>Admin</td></tr><tr><td>Linus</td><td>Author</td></tr></tbody></table>

Saída

[
  { "Name": "Ada", "Role": "Admin" },
  { "Name": "Linus", "Role": "Author" }
]

As células <th> viram as chaves do objeto e cada <tr> vira um objeto-linha.

Erros comuns e solução de problemas

Perguntas frequentes

Como o conversor escolhe as chaves JSON da minha tabela?
Ele usa as células de cabeçalho. Uma linha <thead>, ou uma primeira linha que contém células <th>, fornece as chaves. Cada linha seguinte vira um objeto cujos valores são alinhados a esses cabeçalhos pela posição da coluna.
O que acontece com células colspan e rowspan?
Elas são expandidas em uma grade densa. Uma célula colspan é repetida por cada coluna que ela cobre, e uma célula rowspan é levada para baixo até cada linha que ela abrange, para que todo objeto-linha tenha o mesmo conjunto de chaves.
Ele consegue extrair mais de uma tabela de um trecho de página?
Sim. Cole um trecho inteiro e cada <table> é extraída na ordem do documento. Um seletor de Tabela permite alternar entre elas e copiar o JSON ou CSV de cada tabela separadamente.
E se minha tabela não tiver linha de cabeçalho?
Quando não há <thead> nem <th> na primeira linha, a ferramenta sintetiza chaves nomeadas column_1, column_2 e assim por diante, e trata cada linha como dado em vez de descartar a primeira.
Ele também gera CSV, não só JSON?
Sim. Mude o seletor de formato para CSV para obter uma exportação RFC-4180 em que valores contendo vírgulas, aspas ou quebras de linha ficam corretamente entre aspas. Você pode copiá-la ou baixar um arquivo .csv.
O HTML que eu colo é enviado para algum lugar?
Não. A marcação é analisada no seu navegador com o parser DOM padrão e o JSON e CSV resultantes são construídos no seu dispositivo. A tabela colada nunca é enviada a um servidor.

Ferramentas relacionadas

Todas as ferramentas de ArrayKit