HTMLをJSONに変換
保存したWebページから表を取り出し、コードでそのままループ処理できるJSONとして受け取れます。見出しセルがキー名になり、表の各行が配列内の1つのオブジェクトになります。
データ変換
またはCSV, TSV, TXT … ファイルをここにドロップ ·
1ファイルあたり最大95 MB· 最大20ファイルまで· 30分後に削除
ファイルは当社のサーバーで処理され、30分後に削除されます。
CSVやテキストファイルで列を区切る文字です。読み込みと書き出しの両方に使われます。自動は入力から判別し、書き出しはカンマにします。
UTF-8はあらゆる言語に対応します。WindowsのExcelでCSVを開いたときにアクセント文字や日本語などが文字化けする場合は、BOM付きUTF-8を選んでください。
Excel、ODS、Numbersの入力用です。最初のシートだけ、またはすべてのシートを変換します(CSVはシートごとに1ファイルをZIPにまとめ、JSONはシートごとに1つのキーになります)。
新しいスプレッドシートのシートタブの名前です。31文字までです。
オブジェクトの配列は、各行で列名をキーにします。配列の配列はよりコンパクトで、ヘッダーを最初の配列として保持します。
すべての行を囲む外側の要素の名前です。各行はその中で<row>になります。
CREATE TABLE文とINSERT文で使われます。英字、数字、アンダースコアのみ使えます。
引用符の付け方や列の型はデータベースごとに少しずつ異なります。インポート先に合わせて選んでください。
日付のセルを1つの形式に書き換えます。ISO(2026-10-18)はデータベースやコードに最も安全です。そのままは元の表記を保ちます。
このツールの使い方
- 1
ページまたは表を保存する
ブラウザで Ctrl+S(Mac は Cmd+S)を押して HTML ファイルを保存するか、開発者ツールから表のマークアップをコピーして .html ファイルに貼り付けます。アップロードできるのは1ファイル95 MBまで、最大20ファイルです。
- 2
JSONの形式を選ぶ
「オブジェクトの配列」があらかじめ選択されています。詳細設定のJSONの構造を「配列の配列」に切り替えると、よりコンパクトなファイルになります。整形して出力をオフにすると1行で出力されます。
- 3
変換してデータを使う
JSONに変換 →を押してファイルをダウンロードし、JavaScript の
JSON.parse、Python のjson.load、または任意の API クライアントで読み込みます。
ページを保存して .html ファイルをアップロードすると、表の各行が、表の見出しセルをキーとするJSONオブジェクトとして返ってきます。
Webの表をJSONにする必要があるとき
便利なデータの多くは、HTMLの表としてしか存在しません。為替レートのページ、スポーツリーグの順位表、イントラで表示はされてもダウンロードできないレポート、全サーバーを並べたステータスページなどです。ブラウザではきれいに表示されますが、グラフを作るフロントエンド開発者やフィクスチャデータが必要なテスターが欲しいのは、オブジェクトの配列です。
よくある方法はスクレイパーです。ページを取得し、Beautiful Soup や Cheerio で解析し、行をたどってセルを対応付けます。ページが毎日変わるなら書く価値があります。一度だけ必要な表なら、保存したページをアップロードするほうが早く、保守するものも残りません。
HTMLの表をJSONに変換した例
<table>
<tr><th>City</th><th>Founded</th></tr>
<tr><td>Porto</td><td>1123</td></tr>
<tr><td>Graz</td><td>1128</td></tr>
</table>
[
{ "City": "Porto", "Founded": 1123 },
{ "City": "Graz", "Founded": 1128 }
]変換で残るもの・失われるもの
- 保持されるもの:セルの文字列、キーになる見出し行、行の順序
- 削除されるもの:CSS、インラインスタイル、クラス、表の周りのページ
- 削除されるもの:セル内の画像やアイコン(文字としての値がないため)
- リンクのセルは、URLではなく表示されているテキストが残ります
- セルの前後の空白は前後の空白を削除で取り除かれます
- 出力は UTF-8 です。システム間で共有するJSONには RFC 8259 で UTF-8 が必須とされています
HTML→JSON変換の制限
- 保存したページに対応
- .html .htm
- 1回で処理できるページ数
- 20
- アップロード1ファイルあたり
- 95 MB
- その後ファイルは削除されます
- 30分
HTMLとJSONの比較
HTML
ハイパーテキスト・マークアップ言語
HTMLはウェブのマークアップ言語で、1990年代初めにティム・バーナーズ=リーが考案し、現在はWHATWGが「Living Standard」として管理しています。HTMLファイルは見出し、段落、リンク、表、画像、フォームを記述し、見た目の装飾は通常CSSが担当します。すべてのブラウザで表示でき、メールテンプレートや保存したウェブページにも使われます。HTMLファイル単体では外部の画像やスタイルシートに依存していることが多く、単独で移動すると表示が崩れる場合があります。
- 圧縮方式
- –
- 透過
- –
- アニメーション
- –
- 登場時期
- 1993 · Tim Berners-Lee; maintained by WHATWG
JSON
JavaScriptオブジェクト表記
JSONは構造化データ用の軽量なテキスト形式で、2000年代初めにDouglas Crockfordが広め、RFC 8259とECMA-404として標準化されました。オブジェクト、配列、文字列、数値、真偽値、nullを、シンプルで読みやすい構文で表現します。ウェブAPI、設定ファイル、ほぼあらゆるプログラミング言語でのアプリ間のデータ交換における標準的な形式です。コメント、日付、スキーマは標準では含まれず、深くネストした大きなファイルはビューアなしでは読みにくくなります。
- 圧縮方式
- –
- 透過
- –
- アニメーション
- –
- 登場時期
- 2001 · Douglas Crockford
レポートページ、社内イントラ、公的な統計サイトなどで人が読むために公開された表を、スクリプト、グラフライブラリ、API テストに渡す必要があるときに、HTMLからJSONへ変換します。
この2つの形式は、由来が異なります。HTMLは1991年にティム・バーナーズ=リーが最初に説明し、現在は WHATWG がリビングスタンダードとして管理しており、文書を表示するためのマークアップです。JSONはダグラス・クロックフォードが仕様化し、RFC 8259 と ECMA-404 として標準化されており、データだけを保持します。前者から後者への変換は、ほぼ見た目の情報を捨てる作業なので、結果は保存したページよりずっと小さくなるのが普通です。Webページではなく XML フィードとして提供された表には、XMLをJSONに変換が同様に使えます。
HTML→JSON変換に関するよくある質問
Webページ全体を読み込みますか？それとも表だけですか？
対象は表のマークアップのみで、table、tr、th、td 要素の中の行とセルです。ナビゲーションメニュー、段落、div 要素で作ったカード型レイアウトは表形式のデータではないため、JSONには変換されません。
JSONのキーにはどの行が使われますか？
見出し行です。通常は表の先頭にある th セルを指します。1行目を見出しにするをオンにすると、その文字列が下にある各値のキーになります。たとえば「Population」という見出しの列は、すべてのオブジェクトで "Population": "…" になります。
colspanやrowspanのセルはどう処理されますか？
結合セルは複数のグリッド位置にまたがりますが、値は1つだけです。値は最初の位置にだけ入ります。変換後に結合された列を確認し、表が結合見出しに依存している場合はコードで空白を補ってください。
JSONの数値にカンマや脚注記号が含まれるのはなぜですか？
Webの表は読み手向けに書かれているため、セルが 1,204,000 や 8.3[2] のようになっていることがあります。1123 のような単純な数字はJSONの数値になりますが、それ以外は有効な数値ではないため文字列のままです。計算する前に、コードで区切り文字や脚注記号を取り除いてください。
Webサイトから表を抽出しても問題ありませんか？
それはファイル形式ではなく、サイトの利用規約とデータの内容によります。公的な統計や自分でエクスポートしたレポートであれば問題ないのが通常です。他の人のコンテンツを再利用する場合は、事前に規約を確認してください。
JSONではなくスプレッドシートで受け取れますか？
はい。HTMLをCSVに変換すると、同じ表をカンマ区切りの行として書き出せます。Excel、Google スプレッドシート、Numbers で開けます。