普段ブラウザ使っている時に、文字をコピーしてGoogle検索をしたりしますよね?iMacrosのExtractを使うと このコピーが出来ます。ちなみに、Extractとは抜き取りや抽出という意味ですね。iMacrosだけだと単なるコピーですが、Javascriptと連携させると話題のスクレイピンが出来ますよ。Extractもブラウザを自動化するために必要な機能ですね。今回はExtractの使い方をご紹介します。
Extractの使い方
では、早速使い方を確認しましょう。Extractは以下のように、TAGコマンドの一部として使用します。TAGコマンドの使い方はこのページ(POSの使い方、XPATHの使い方)を見てくださいね。
この”ext”に決まったパラメータを設定すると、その要素を抽出(Extract)することが出来ますよ。
Extractのパラメーター
パラメーターには以下の7つを設定することが出来ます。色々ありますが、よく使うのはNo.1のTXTとNo.3のHTMです。この他はJapascriptと連携すれば抽出することが出来ます。そちらのほうが応用が効くと思うので、ここではTXTとHTMの二つを使って見ましょう。
No. | パラメーター | 抽出できる要素 |
1 | TXT | 表示されているテキストデータ。ドリップダウンリストの場合は、表示されているテキスト。 |
2 | TXTALL | ドロップダウンリストのリスト。 |
3 | HTM | タグを含むHTMLの全て。 |
4 | HREF | リンクに設定されているURL。 |
5 | ALT | imgタグで設定されているalt要素。 |
6 | TITLE | タグに設定されているtitle要素。 |
7 | CHECKED | チェックボックやラジオボタンの状態。 |
ExtractでTXTを使う
それではTXTのパラメータを使って、表示されているテキストを抽出して見ましょう。
駅探のサイトの上部に”乗り換え案内、時刻表”のテキストがありますね?このテキストをEXTRACTで抽出してみます。
テキストのタグ確認とテキストの抽出
”乗り換え案内、時刻表”のテキストのタグをFirefoxの開発ツールで確認すると、次のようになっていますね。
<h1>乗り換え案内、時刻表</h1>
このテキストを抽出するためのimacrosプログラムは次のように書けます。
1 2 |
VERSION BUILD=9030808 RECORDER=FX TAG POS=1 TYPE=H1 ATTR=* EXTRACT=TXT |
開発ツーツでこのサイトのHTMLを見ると、このh1タグより前にh1タグが使用されていないことが分かります。なので、TAGコマンドで “POS=1” と書けますね。また、属性は特にありませんので “ATTR=*” としましょう。
プログラムを実行すると、次のようなポップアップが表示されます。”Extracted text:” の中に抽出しようとした文字列がありますね。これで抽出が成功していることが分かります。
では抽出(コピー)した文字列を使って見ましょう。普通の使い方だと、コピーしたものはテキストファイルとかに貼り付けたりしますが、ここは簡単に他のコマンドで表示させることにします。
抽出した結果の表示
まず、抽出したデータですが、これはiMacrosの変数である “!Extract” に保存されています。この!ExtractのデータをiMacrosの出力コマンドであるPromptで表示させます。今回の使い方では次のようになります。!ExtractはiMacrosがもともと持っている変数なので、このような変数をiMacrosで扱う場合 “{{ }}” で囲みます。
このPromptコマンドを使って、抽出したテキストを表示するiMacrosのプログラムは次のようになります。
1 2 3 |
VERSION BUILD=9030808 RECORDER=FX TAG POS=1 TYPE=H1 ATTR=* EXTRACT=TXT PROMPT {{!EXTRACT}} |
これを実行すると、TAGコマンド結果のポップアップの後に、次のようなポップアップが表示されます。これがPromptの結果です。ここに抽出したテキストが表示されていますね。
さて、これでEXTRACTを使って目的のテキストを抽出して、画面に表示させてみました。コピーしたテキストは、例えばGoogle検索に使ったり、どこかに保存したりするなど考えられますが、このあたりは徐々にやっていきましょう。
ExtractでHTMを使う
続いて、ExtractのパラメータにHTMを指定して抽出してみましょう。HTMを指定すると”タグを含む要素を全て”抽出できると説明しましたが、なんだか良くわらないと思うので、まずはやってみましょう。
まず、先ほどは”乗り換え案内、時刻表”のテキストのタグを狙いましたが、今度は分かりやすいように、その二つ上にあるDIVタグを狙って見ましょう。
HTMの抽出と表示
先ほどの作ったプログラムを、このDIVタグを狙ったTAGコマンドに変えて実行してみましょう。(TAGコマンドの確認はこちら)
1 2 3 |
VERSION BUILD=9030808 RECORDER=FX TAG POS=1 TYPE=DIV ATTR=ID:header_top EXTRACT=HTM PROMPT {{!EXTRACT}} |
すると、TAGコマンドの結果が以下のように出力されますね。結果が横に並んでいるので分かりにくいですが、これは、狙ったDIVが囲む範囲 (div id=”header_top”>〜</div/)全てを抽出しています。一つ上の図と比べて見てください。
Promptの表示も以下のように、同じようになっていますね。
このようにEXTRACTのパラメータにHTMを設定すると、”タグを含む要素を全て” 抽出(コピー)することが出来ます。
この抽出したHTMは何に使うかというと、通常タグの中に書かれている、例えばclassやid、画像のURLなどを示すsrcの情報はブラウザでは見ることが出来ません。つまり、選択が出来ないので、人間がやっているようなマウスで選択してコピーということが出来ないのです。でも、このHTMを使えば、例えば抽出した結果から画像のURLだけをさらに抽出するといったことができるようになります。このような方法はJavascriptと連携出来るからこそ可能になるのです。これがiMacrosをFirefoxで使ういいところの一つですね。
少し長くなりましたが、以上がiMacrosでExtractを使って要素を抽出(コピー)する方法です。このコピーができるようになると、ブラウザ操作へ色々と応用が出来るので、是非習得してくださいね!
iMacrosでFirefoxを自動操作する方法はこちらから! |