HTMLテーブル→CSV変換
HTMLの <table> タグを含むソースを貼り付けると、CSV/TSVに変換します。他サイトの表をコピーしてスプレッドシートに取り込みたいときに便利です。thead内の見出し行を自動認識し、変換処理はすべてブラウザ内で行われサーバーには送信されません。
HTMLテーブルとCSVの行の対応
| HTMLの1行 | <tr><td>name</td><td>age</td><td>city</td></tr> |
|---|---|
| 変換後のCSV記法 | name,age,city |
<thead> 内の行、または最初の行が <th> のみで構成される場合は見出し行として認識され、それ以外の各 <tr> はデータ行としてCSVの1行に変換されます。
HTMLテーブル→CSV変換とは
HTMLテーブル→CSV変換は、Webページに埋め込まれた <table> タグのソースコードを貼り付けるだけで、CSVまたはTSV形式のデータに変換するツールです。他サイトの表を範囲選択してコピーすると、クリップボードには文字列だけでなくHTML構造も一緒に格納されていることが多く、それをそのまま貼り付けて変換できます。<thead> 内の行、または最初の行のセルがすべて <th> で構成されている場合は見出し行として自動的に認識されるため、見出しの有無を手動で指定する必要はありません。
セル内に <strong>・<br>・<a> といった装飾タグが含まれていても、変換時にタグだけが取り除かれテキスト内容のみが残ります。区切り文字はカンマとタブから選べ、見出し行を出力に含めるかどうかも切り替えられます。複数の <table> タグを含むHTMLを貼り付けた場合は、最初に見つかったテーブルのみが変換対象になります。処理はすべてブラウザ内のJavaScriptで完結しており、入力したHTMLがサーバーに送信されることはありません。
HTMLテーブル→CSV変換の使い方
- HTMLソースを貼り付ける 変換したい表を含むHTMLソースを入力欄に貼り付けます。試しに使ってみたい場合は「サンプル」ボタンで例を読み込めます。
- 区切り文字を選ぶ スプレッドシートに取り込む場合はカンマ、タブ区切りのテキストとして扱いたい場合はタブを選びます。
- 見出し行を含めるか選ぶ 「見出し行を出力に含める」のチェックで、変換結果に列名の行を含めるかどうかを切り替えられます。
- 変換結果を確認する 入力と同時に右側にCSV/TSVが表示され、変換できた行数も表示されます。
- コピーまたはダウンロードする 「コピー」ボタンでクリップボードに、「ダウンロード」ボタンでファイルとして結果を取得できます。
使いこなすためのヒント
<thead>/<tbody>タグが無いHTMLでも、最初の行のセルがすべて<th>であれば見出し行として自動認識します。- セル内の
<strong>・<br>等の装飾タグは自動的に取り除かれ、テキスト内容のみがCSVに変換されます。 - ブラウザで他サイトの表を範囲選択してコピーすると、クリップボードにHTML形式のデータが含まれていることが多く、そのままこのツールに貼り付けて変換できます。
- 姉妹ツールのCSV→HTMLテーブル変換とは逆方向の変換で、対で使うことでCSVとHTMLテーブルを行き来できます。
HTMLテーブル→CSV変換の活用シーン
他サイトの表をスプレッドシートに取り込む
ニュースサイトや統計ページに掲載された表を開発者ツールでコピーし、そのままExcelやGoogleスプレッドシートで扱える形式に変換できます。
スクレイピングで取得したHTMLの整理
プログラムで取得したページのHTML断片から表データだけを取り出し、CSVとして保存・加工したいときに使えます。
CMSやWikiの表組みをデータ化する
社内Wikiやブログの記事内に手打ちで書かれた <table> をCSVへ書き出し、集計や検索がしやすい形にできます。
メールやドキュメントに貼られた表の再利用
HTMLメールやWord文書からコピーした表組みのソースを、他のツールへ受け渡しやすいCSV形式に変換できます。
CSV→HTMLテーブル変換との往復
逆方向の変換ツールと組み合わせれば、CSVとHTMLテーブルの間を自由に行き来しながらデータを整形できます。
HTMLテーブルとCSVに関する用語集
- thead / tbody
- HTMLの表を「見出し部分」と「本体部分」に分けるためのタグです。
<thead>内の行があれば、このツールはそれを見出し行として扱います。 - th / td
- 表のセルを表すタグで、
<th>は見出しセル、<td>は通常のデータセルを表します。theadが無いHTMLでは、最初の行が全て<th>かどうかで見出しの有無を判定します。 - CSV（Comma-Separated Values）
- カンマで列を区切ったプレーンテキスト形式のデータです。値にカンマや改行、ダブルクォートが含まれる場合は、その値全体をダブルクォートで囲んでエスケープします。
- TSV（Tab-Separated Values）
- カンマの代わりにタブ文字で列を区切る形式です。値そのものにカンマを含むデータを扱うときに、CSVよりも列の区切りが曖昧になりにくい利点があります。
- HTMLエンティティ
&（&）や （半角スペース）のように、特殊文字をHTML上で表すための表記です。変換時には元の文字に自動的に戻されます。- 装飾タグの除去
- セル内に含まれる
<strong>・<br>・<a>などのタグを取り除き、テキスト内容だけを残す処理です。リンクのURLなどタグの属性値はCSVには含まれません。
よくある質問
<table> タグを含む範囲をコピーして貼り付けてください。<thead> タグが無くても、最初の <tr> のセルがすべて <th> であれば見出し行として扱われます。それにも該当しない場合は、全ての行がデータ行としてそのまま変換されます。<table> タグのみが変換対象になります。複数の表を変換したい場合は、それぞれのテーブルのHTMLを個別に貼り付けて変換してください。
余談ですが ― ブラウザの「表コピー」はなぜHTMLを含むのか
ブラウザで表の範囲を選択してコピーすると、クリップボードには見た目上の文字列だけでなく、裏側でHTML形式のデータも同時に格納されています。これはOSのクリップボードが「マルチフォーマット」に対応しているためで、コピー元のアプリケーションが複数の表現形式（プレーンテキスト・HTML・リッチテキスト等）を同時に書き込み、貼り付け先のアプリケーションが最も都合の良い形式を選んで受け取れる仕組みになっています。
Excelやスプレッドシートに他サイトの表をそのまま貼り付けると、書式やリンクまで含めて再現されることがあるのはこの仕組みのおかげです。一方で、貼り付け先が単純なテキストエディタやCSVファイルの場合、この裏側のHTML情報は活用されずプレーンテキストとして扱われてしまい、表組みの構造（どのセルがどの列に属するか）が失われがちでした。
HTMLテーブル→CSV変換のようなツールは、まさにこの「失われがちな構造情報」を明示的に復元する役割を担っています。ブラウザの表コピー機能が持つHTML構造をそのまま活かし、スプレッドシートで正しく列分けされたデータとして再利用できるようにする、実務上地味だが確実に需要のあるジャンルです。