|
Delphi Programming / Object Pascal

[掲載 2024年06月07日] [更新 2024年06月10日] Delphi 一般・その他 [未分類 - OS の操作等] |
ウェブページの表のセル選択 - Firefox |
動作確認等 |
Windows 10 ビルド 19045 Pro 64 bit
Firefox 125, Microsoft Office 2019 |
ウェブブラウザで表示しているウェブページの表のセルを,セル単位,行単位,列単位,あるいは表単位で選択する方法です.
本ページの操作は,Firefox 125 における結果です.Google Chrome, Microsoft Edge では利用できません.本ページの記事では,以下の表を使用した結果を掲載しています.これは,文字コード表の一部です.この表を操作することによって,記事の内容が確認できます. |
|
0 |
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8890 |
袐 |
袑 |
袒 |
袓 |
袔 |
袕 |
袖 |
袗 |
88A0 |
袠 |
袡 |
袢 |
袣 |
袤 |
袥 |
袦 |
袧 |
88B0 |
袰 |
袱 |
袲 |
袳 |
袴 |
袵 |
袶 |
袷 |
88C0 |
裀 |
裁 |
裂 |
裃 |
裄 |
装 |
裆 |
裇 |
88D0 |
裐 |
裑 |
裒 |
裓 |
裔 |
裕 |
裖 |
裗 |
[備考 1]
表のセルを選択すると,[Ctrl] + [C] などのコピー操作で,選択したセルのテキストをクリップボードに格納できます.この時,各々のセルのテキストの間にはタブ文字が挿入され,行末には改行文字が追加されたテキストデータとなります.これを「タブ区切りデータ」とか「タブ区切りテキスト」と言います. |
[備考 2]
ドラッグ (マウスドラッグ) とは.マウスのボタンを押したままの状態でマウスカーソルを移動する操作です.本ページでは,全て,マウスの左ボタンを使用します. |
Firefoc 以外のブラウザでも利用可能な,表のセルの一般的な選択方法です.
マウスのドラッグ゛による選択です. |
 |
図1
ウスドラッグ゛による選択
- 88A のセルから次行の 4 番目までのセルまでをドラッグした結果
|
[Ctrl] + [C] で選択したセルのテキストをコピーします.それを Windows 10 に付属のメモ帳に貼り付けたのが下図です.ただし,貼り付けた後,タブ文字を削除しています.
メモ帳での貼り付け操作は [編集] [貼り付け] です.ショートカットキーは [Ctrl] + [V] です. |
 |
図2
選択セルをメモ帳に貼り付け
|
[備考]
これ以降のセルの選択操作は,Firefox 125 における結果です.
Google Chrome 124, Microsoft Edge 124 では,これ以降のセルの選択操作はできません.表の選択操作用の拡張機能があるようですが,筆者は利用した経験はありません.筆者の場合,必要な時はFirefox を起動しています. |
[Ctrl] キーを押した状態でセルをクリックすると,そのセルが選択された状態になります.選択されたセルには枠線が描画されます.
再度 [Ctrl] キーを押下した状態でクリックすると,選択解除となります. |
 |
図3
任意のセルの選択 |
 |
図4
複数のセルを選択した状態 |
上の図の状態でコピーしたデータをメモ帳に貼り付けた結果です. |
 |
図5
選択したセルのデータ |
選択したセルのテキストのコピーは,[Ctrl] + [C] で可能ですが,下図のように,ポップアップメニューからもできます. |
 |
図6
選択セルのテキストのコピー
- マウスの右ボタンクリックで現れる
メニューで [コピー] を選択
|
上と同じ複数のセルの選択ですが,連続したセルを選択する方法です.
[Ctrl] キーを押したままドラッグします.
これは矩形領域の選択となります. |
 |
図7
連続したセルの選択
|
下図は,選択したセルの値を [Ctrl] + [C] でコピーして,メモ帳に貼り付けた結果です. |
 |
図8
選択したセルのデータ |
04_ウェブページの表のセル内のテキストを全て選択 |
以下のように,表のセルには,複数行のテキストが表示されていることがあります. |
単一行 |
袐 袑 袒 袓 袔 袕 袖 袗 |
複数行 |
袠 袡 袢 袣 袤 袥 袦 袧
袰 袱 袲 袳 袴 袵 袶 袷 |
このようなセルの場合,これまでの操作で選択できますが,このセルだけのテキストの選択であれば,[Ctrl] + ダブルクリックでも選択できます. |
 |
図9
複数行のテキストの選択
|
 |
図10
複数行のテキストの選択
|
行全体のセルを選択する方法です.
[Ctrl] キーと [Shift] キーを押したままの状態で,目的の行の任意のセルでマウスの左ボタンを押したままにします.
|
 |
図11
行選択操作の開始
- [Ctrl] + [Shift] + 左ボタン押下
|
マウスを横方向にドラッグします.つまり,選択したセルと同じ行の右または左のセルにドラッグします.すると,その行全体が選択状態になります. |
 |
図12
行全体が選択された状態 |
そのまま縦方向にドラッグ,つまり,上か下の行にドラッグすると,ドラッグ先の行も洗濯状態になります.これは複数行の選択となります. |
 |
図13
複数行を選択した状態 |
下図は,選択したセル (の値) を [Ctrl] + [C] でコピーしてメモ帳に貼り付けた結果です.メモ帳に貼り付けた後,タブ文字を半角の空白文字に置換しています. |
 |
図14
選択したセルのデータ
|
列全体のセルを選択する方法です.
[Ctrl] キーと [Shift] キーを押したままの状態で,目的の列の任意のセルでマウスの左ボタンを押したままにします. |
 |
図15
列選択操作の開始
- [Ctrl] + [Shift] + 左ボタン押下
|
マウスを縦方向にドラッグします.つまり,選択したセルと同じ列の上または下のセルにドラッグします.すると,その列全体が選択状態になります. |
 |
図16
列全体が選択された状態 |
そのまま横方向にドラッグ,つまり,右か左の列にドラッグすると,ドラッグ先の列も洗濯状態になります.これは複数列の選択となります. |
 |
図17
複数列を選択した状態 |
下図は,選択したセル (の値) を [Ctrl] + [C] でコピーしてメモ帳に貼り付けた結果です. |
 |
図18
選択したセルのデータ |
この列の選択では,表の行数や,表全体のデータが多いと Firefox が応答しなくなることがあります.選択操作で待ち状態のカーソルが続いた場合,ウェブページの任意の場所をクリックします.すると,下図のようなダイアログが現れます.
このダイアログで [プログラムを終了します] をクリックして Firefox を終了します.Firefox を再起動すると,列の選択操作か正常にできるようになります.
|
 |
図19
待ち状態が長く続く場合
- ページ内の任意の場所をクリック
- [プログラムを終了します] を選択
- Firefox を再起動
- [セッションを復元]
- 再度,該当のウェブページを表示して選択操作ほ行う
|
[備考]
特定の列だけのデータが必要な場合でも,表全体をコピーしてエクセルのシートに貼り付けた後に処理した方が確実かも知れません. |
07_ウェブページの表の全てのセルを選択 ( 表の選択 ) |
表を選択する方法です.表を選択すると,その表の全てのセルが選択状態になります.
[Ctrl] キーを押した状態で,表の枠線をクリックします.枠線の内部をクリックするとそのセルの選択です.枠線の外側をクリックすると,何も選択されないか,その表以外も選択状態になります.これは,ウェブページの構成によります.
この操作は微妙かも知れませんが,画面に表示されていない部分も含めて,スクロールなしで表全体を選択することができます. |
 |
図20
表を選択した状態 |
上の図の状態でコピーしてメモ帳に貼り付けた結果です.メモ帳に貼り付けた後,タブ文字を削除しています. |
 |
図21
表全体のセルのデータ
|
ウェブページのセル (の値) をコピーすると,セルのテキスト間にタブ文字が挿入されます.そのテキストをメモ帳に貼り付けると,下図のように,タブ文字は空白として表示されます.
タブ文字は,空文字に変換すれば削除になります. |
 |
図22
タブ文字で区切られたテキスト |
テキストの右側に,入力位置を示すキャレットを移動します.[Shift] + [→] の操作をするとタブ文字が選択されます.
[編集] [置換] で置換ダイアログを表示します (ショートカットは [Ctrl] + [H] ).[置換後の文字列] を空文字 (入力文字なし) にして [全て置換] をクリックします.下図では半角スペースに置換するようにしています. |
 |
図23
タブ文字の置換
- [Shift] + [→] てせタブ文字を選択
- [Ctrl] + [H] でダイアログを表示
- この画像は合成画像
|
 |
図24
置換後のテキスト |
一般的なマウスドラッグでセルのテキストを選択した場合,タブ文字の前に半角スペースの文字が追加されたテキストとなります. |
 |
図25
セルのテキストの選択方法による違い
- 1 行目
一般的なマウスドラッグによる選択
- 2 行目
本ページの操作による選択
- これは合成画像
上に重ねた画像の一部を透明化 |
09_ コピーしたセルの値をエクセルのシートへ貼り付け |
エクセルのシートには,シートの,貼り付け開始位置のセルをクリックした後,[Ctrl] +[V] のキー操作で貼り付けできます.下図は Microsoft Excel のシートに貼り付た結果です.ウェブページの表の各セルの値が,エクセルの各セルに代入されます.
この図では,列単位でコピーした結果をエクセルに貼り付けています.
ウェブページの表のセルを選択した後,マウスのドラッグ & ドロップの操作でも,エクセルのシートに貼り付けることができます. |
 |
図26
エクセルへの貼り付け |
[備考]
Windows 10 のメモ帳には,ドラッグ & ドロップでテキストを受け取る機能はありません.
一般的なテキストエディタは,この機能を実装しています. |
コピーしたセルのテキストデータを Microsoft Word 2019 の文書に貼り付けると,下図のように罫線付きとなります.テキストだけを貼り付けたい場合は,[形式を選択して貼り付け] で,[テキスト] または [Unicode テキスト] にします.Windows 10 は Unicode なので,どちらでも結果は同じです.
ウェブページの表のセルを選択した後,マウスのドラッグ & ドロップの操作でも,ワードの文書に貼り付けることができます. |
 |
図27
ワードへの貼り付け
|
特定の表を画像にしてコピーしたり,保存できます.
[Ctrl} + [Shift] + [S] でスクリーンショットの機能を起動します.対象の表が見える位置までスクロールして,その表の枠線の位置にマウスカーソルを移動します.下図のように表全体が選択された状態になります.この状態でクリックします. |
 |
図28
表を画像にする
- [Ctrl] + [Shift] + [S]
- 表の枠線上でマウスクリック
|
選択状態の表が表示されます.この下図の状態で [コピー] ボタンをクリックします.
表の一部を画像にする場合は,選択範囲を変更します.選択領域はマウス操作で変更できます. |
 |
図29
[コピー] をクリック |
[備考]
表の枠線上で表全体が選択状態にならない場合は,表の左上からマウスをドラッグして表全体を選択するようにします. |
12_ Microsoft Edge の [ Web 選択 ] による表のテキスト取得 |
Microsoft Edge 116 までは [Web 選択] というツールがあり,ウェブページの表のテキストを取得することができました.本記事掲載時点における Microsoft Edge のバージョンは 125 ですから,この機能は利用できませんが,どのようなツールであったのかを紹介しておきます.
以下は,Microsoft Edge 116 における操作結果です.
[Ctrl] + [Shift] + [S] で [Web キャプチャ] (現在は [スクリーンショット]) を起動します.その一部として [Web 選択] がありました. |
 |
図30
[Web 選択]
|
[Web 選択] をクリックすると,マウスカーソルが十字になります.それをドラッグして,対象の表全体を矩形で囲んでマウスボタンを離します.その状態で [Ctrl] + [C] でコピー操作を行うと,矩形領域内のテキストと矩形領域が画像としてクリップボードに格納されます.
表のテキストの場合は,各セルのテキストはタブ区切り文字となります. |
 |
図31
表全体を選択
- [Ctrl] + [C] で表の全てのテキストがコピーできる
|
特定の列だけのテキストを取得したい場合は,対象の矩形領域として列を選択します.この選択用の矩形は,位置とサイズがマウスで自由に変更できます.
長い行や,長い列の選択操作にはスクロールが伴います.Firefox における行と列の選択操作では,行と列の長さに関係なく,スクロールはありません. |
 |
図32
列の選択 |
[備考]
Microsoft Edge の [Web 選択」はバージョン 117 では廃止になりました.その後も起動オプションで使用可能になっていましたが,バージョン 122 で,それも廃止になりました. |
|