HTML テーブルを簡単に CSV としてコピーする方法
インターネットでホームページを見ていたりすると以下のような HTML の表(テーブル)を見かけることがありますね。このテーブルのデータを CSV としてコピーしたい！！という場面があるかと思います。そんな時に便利な Chrome 拡張機能を紹介します。例えば以下のような HTML テーブルを CSV としてコピーしたいとしましょう。通常だと全体をマウスでコピーして WORD や EXCEL に貼り付けたり、テキストエディタに貼り付けて手作業で頑張って加工したりする必要があります。しかしそのようなことをしなくても、ここで紹介する Chrome 拡張機能を使えば一瞬で CSV 形式で HTML テーブルのデータをコピーすることが出来ます。
Chrome 拡張機能 Copytables を導入する
まず初めに HTML テーブルをコピーする便利な拡張機能をインストールしましょう。下記リンクから Chrome 拡張機能をインストールする画面に移動してインストールします。ここから Chrome 拡張機能 Copytables をインストール
https://chrome.google.com/webstore/detail/copytables/ekdpkppgmlalfkphpibadldikjimijon?hl=en
下記の画面で "Add to Chrome" という青色のボタンをクリックしてインストールしましょう。
これで Chrome 拡張機能のインストールは完了です。ここで Chrome 拡張機能ボタンの中の赤丸で囲まれたボタンを、マウスの左クリックで押下します。
すると下図のように拡張機能のメニュー画面が表示されますので、赤枠で囲まれた "Tables" をクリックします。
この状態で、参考例としてタイ国際航空のホームページを開きます。下のリンクをクリックして下さい。
[タイ国際航空]
http://chiangmaitravel.jp/air/time_ch_bk_thai.html
ホームページを開くと次のような HTML テーブルが表示されていることが確認できます。
次に飛行機の出発時刻が表示されている HTML テーブルをマウスの左ボタンで一度だけクリックしましょう。すると次のように HTML テーブル全体が選択された状態となっています(HTML テーブルが青色に変化している状態です)。
この選択された状態で再度 Chrome 拡張機能 Copytables のボタンを押して CSV ボタンを押します(下図の赤枠部分)。
CSV ボタンを押すことによって、HTML テーブルデータが CSV データとしてクリップボードにコピーされています。それでは Sublime Text 3 などのテキストエディタを起動してコピーされたデータを貼り付けてみましょう。すると次のように HTML テーブルのデータが CSV データとしてコピーされたことがわかります。
データをコピーし終えたら、拡張機能をオフにしておきましょう。拡張機能をオフにするためには下図のように "Off" ボタンをクリックするだけです。拡張機能が On のままだと、通常インターネットでホームページを閲覧している時にも HTML テーブルをコピーしようとしてしまい、不都合が生じる場合があるためです。
