メインで使っているブラウザはChromeですが、たまにFirefoxを使わざるを得ない時もあります。
ChromeでXPathを取得（表示）するプラグインといえば【XPath Helper】です。

動作が軽く、操作がカンタン。Control ＋ Shift ＋ XのショートカットキーでXPath Helperウィンドウを呼び出してShiftキーを押し続け、マウスポインタを取得したい場所に移動させれば、すぐさまXPathが取得できます。

FireFoxでXPathを取得する場合は【Firebug】と【FirePath】のプラグインをインストールします。

上記2つのプラグインをインストールすると、Firebugのメニューに【FirePath】が追加されます。

左側のポインタのアイコンをクリックすると、要素を選択できるモードに切り替わります。マウスポインタを移動させればXPathが表示されます。

何かと便利なXPath。プラグインを併用することで作業効率も大幅にアップしますね！

XML Hacks ―エキスパートのためのデータ処理テクニック

取得するのはFacebook、Twitter、Hatenaのソーシャルカウント数です。

1. Facebook の：イイね数
2. Twitter ：Tweet数
3. Hatena ：はてブ数

使い方はカンタンです。URLの末尾に記事のURLを付けて開くだけ。

Facebook

https://graph.facebook.com/?id=【記事URL】

Twitter

https://urls.api.twitter.com/1/urls/count.json?url=【記事URL】

Hatena

https://api.b.st-hatena.com/entry.count?url=【記事URL】

とてもシンプルな方法ですね！

いちばんやさしいWordPressの教本 人気講師が教える本格Webサイトの作り方

範囲指定

field:[100 TO 200]

ソート（降順）

&sort=field%20desc

良く使う割にすぐに忘れてしまうので付箋にでも書いておこうと思います。

[改訂新版] Apache Solr入門 ~オープンソース全文検索エンジン

ブラウザを自動で操作できる便利なソフトSelenium。人がブラウザを使って行う操作のほとんどはSeleniumで自動ができます。

Seleniumを使ったファイルのアップロード

ファイルのアップロードでつまずいたのでその対処法をご紹介します。
人がブラウザを使ってファイルをアップロードする場合は【ファイルを選択】ボタンをクリックし

ポップアップされたウィンドウからアップロードするファイルを選択します。
この場合、アクティブなウィンドウをポップアップに変更させる必要があります。

対処法

まずはinputの場所をidなどで指定します。

ポイントはクリックしてポップアップを開くのではなく、sendKeysでファイル名を入力することです。
driver.findElement(By.id(“ID名”)).sendKeys(“/Users/sfukuda/Desktop/ファイル名”);

Seleniumを動かしてみるとポップアップ画面を開くことなくファイルを指定することができます。

Seleniumはブラウザが自動で動くので見ているだけでも楽しいものです。

実践 Selenium WebDriver

Eclipseで作成したファイルをDropboxに保存し、別のMacやWindowsからアクセスできれば便利だなと思い、workspaceを変更してみました。

変更方法は簡単です。ファイルメニューから【ワークスペースの切り替え】→【その他】を選択。

【参照】をクリックします。

【Dropbox】を選択し、開くをクリック。これでeclipseで作成したファイルがDropboxに保存され、別のPCでも参照できるようになりました。

Aptanaも同様にワークスペースを切り替えることでDropboxに保存、同期することができます。

EclipseではじめるJavaフレームワーク入門

GoogleDocsのスプレットシートを使ってサイトのタイトルやメタキーワード、メタディスクリプション、H1タグの内容を自動取得、自動表示する方法をご紹介いたします。

まずはGoogleDocsのスプレットシートを作成します。どのセルでもいいので下のコードをコピペします。
=IMPORTXML(“https://www.yahoo.co.jp”,”//title”)

そうすると、セルの中にヤフーのサイトのタイトルが表示されます。
コードの内容は
=IMPORTXML(” サイトのURL “,” XPath “)
となってます。

メタディスクリプションを取得したい場合は //title の内容を下記のように変更します。
//head/meta[@name=’description’]/@content

リストスタイルなど、項目が複数ある場合は【Loading…】が表示され続け、目的の情報が取得できない場合があります。

いつもサイトの特定の情報をチェックする場合にはスプレットシートにまとめておくと一覧表示できるので便利ですよ！

【関連記事】

知っておくと便利なXPath

これからはじめる SEO内部対策の教科書

知っておくと便利なXPathの指定例を紹介いたします。XPathを使うとClassやID、タグ名を指定することで複数の項目をリストで取得できます。
また、文字情報だけでなくsrcやhrefなどのリンクも取得できます。私がよく使っているxpathの使用例をご紹介します。

[contains(@ClassやID,’含まれる文字列’)]

ClassやIDに特定の文字列が入っている場合に活用できます。

使用例：//*[contains(@class,’Cat’)]/strong

カカクコムのカテゴリーをリストで取得してみました。Class名に”Cat”という文字列が共通して入ってます。

[position()=last()]
リストになっている部分の一番最後の項目を取得したい場合、last()を使います。
使用例：//*[@]/span[position()=last()-1]/a/span
カカクコムの現在のカテゴリーを取得しました。last()に-1を付けることで、最後から2番めの項目を取得できます。

応用：//*[@ ]/option[position()＞1]
positionに＜や＞を付けることで一番最初の項目を除外できます。optionの始めの項目はvalueが入っていない場合が多いので、position()＞1はよく使います。

XPathを指定する方法は沢山あります。しかし実際に使う種類は限られてます。用途に応じて使い分けてみてください。

XML Hacks ―エキスパートのためのデータ処理テクニック

画面右側のエディタ(Sample01.java)を
編集できるような状態にします。

下記のコード(オレンジ部分)をコピペします。

package com.html.sample;

import org.openqa.selenium.By;

import org.openqa.selenium.WebDriver;

import org.openqa.selenium.WebElement;

import org.junit.BeforeClass;

import org.junit.Test;

import org.openqa.selenium.chrome.ChromeDriver;

public class Sample01 {

@BeforeClass

public static void Setup() {

System.setProperty(“webdriver.chrome.driver”, “./driver/chromedriver”);

}

@Test

public void test() {

WebDriver driver = new ChromeDriver();

driver.get(“https://www.yahoo.co.jp”);

// name の要素を検索

WebElement element = driver.findElement(By.name(“p”));

// 文字を入力

element.sendKeys(“今日の天気”);

// フォームを送信

element.submit();

//ドライバ終了

driver.quit();

}

}

コピペできたらメニューから【実行】してみます。

Chromeが自動で起動します。
Seleniumの動きとしては
driver.get(“https://www.yahoo.co.jp”);
で『ヤフーを開く』
WebElement element = driver.findElement(By.name(“p”));
で『検索窓のname属性を探す(指定する)』

先ほどの動作で
name属性の場所に
element.sendKeys(“今日の天気”);
『今日の天気』と入力する

検索する

element.submit();

ドライバを終了させる

driver.quit();

という動きが自動実行できます。
if文を使って条件分岐をさせる動作や
繰り返し処理も手軽に作れます。
Seleniumに関する文献や記事は
なかなか見つかりませんが
海外のブログ記事などを読んで
メソッドを探しながら少しずつ
Seleniumに慣れていくと良いと思います
関連記事
Eclipseでjavaを書きSeleniumからChromeで実行する設定方法
スッキリわかるJava入門

Selenium WebDriver パーフェクトガイド

Javaの高機能エディタEclipse

Eclipseを使いコードを書いて

Seleniumを実行することも出来ます。

専用のドライバを使えば

ChromeやIE、Safariなどのブラウザで

Seleniumを実行することが出来ます。

FirefoxのSelenium IDEでは

コマンド、対象、値

のみでしかSeleniumの動きを制御

出来ませんでした。

JavaとSeleniumを組み合わせれば

もっと活用の幅が広がります。

一度設定が完了すれば楽に作業が進められますが

実際に動かすまでの作業がちょっと複雑なので

手順をまとめました。

Macでの設定方法ですが

基本はWindowsも一緒です。

セレニウムJavaのWebdriverを

こちらのリンクからダウンロード

ChromeWebDriverを
こちらのリンクからダウンロード

使っているPCに合わせて
ドライバを選択します。

Selenium WebDriverと
ChromeDriver両方ダウンロードできたら
Eclipseを開きます。
ファイルメニューから
【新規】→【Javaプロジェクト】を選択

プロジェクト名を
『Selenium』と設定しました。
その他の設定は下の画像を参考にして下さい。

パッケージ・エクスプローラーに
『Selenium』というプロジェクトが作成されました。
※その下の『SeleniumTest』は関係ないので
無視して下さい。

『Selenium』のプロジェクトを展開すると
『src』と『JREシステム・ライブラリー』
というフォルダが入ってます。

『src』を右クリックして『新規』
→『パッケージ』をクリック

パッケージ名を
『com.html.sample』
と設定しました。

『Selenium』のフォルダを右クリック
『新規』→『フォルダー』をクリック

フォルダ名を『Driver』と設定しました。

パッケージ・エクスプローラーを見て
作成した『driver』が『Selenium』の
プロジェクトの中に入っていることを確認します。

『driver』を右クリックして
『インポート』をクリック

『ファイルシステム』を選択

ダウンロードした『Chromedriver』のディレクトリを参照し
『Chromedriver』にチェックを入れ完了ボタンをクリック
宛先フォルダが『driver』になっていることを確認します。

『driver』フォルダの中に
『chromedriver』が入っていることを確認します。

『Selenium』フォルダを右クリック
『ビルド・パス』→『外部アーカイブの追加』をクリック

今度はSeleniumのjavaフォルダの中身のファイル(.jar)
を【開く】をクリックして追加します

続いて『libs』のディレクトリの中に入っている.jarファイルを選択し
【開く】をクリック

『参照ライブラリー』の中に
.jarファイルが全て追加されていることを確認します。

『src』→『com.html.sample』パッケージの中に
『クラス』を生成します。

クラス名を
『Sample01』と設定しました。

パッケージ・エクスプローラーを見て

この様な状態になっていることを確認します。

また、『Sample01.java』をダブルクリックし

編集可能な状態にしておきます。

以上で、Eclipseを使ってSeleniumを動かす準備は完了です。

お疲れ様でした。

次の記事はサンプルコードを使って

Seleniumを実行してみます。

わかりやすいJava入門編

Java開発には欠かせないソフト

Mac、WindowsのフリーソフトEclipse

Macの場合、デフォルトの選択画面では
エディタの色は変更できますが

枠の色をダークに変えることは出来ません。

エディタは黒っぽいテーマになりますが

フレームは白いままでイケてませんね(^_^;)

Eclipseが保存されているApplicationフォルダの

CSSファイルが有るところまで移動します。

階層が深いので画像を参考にしてみてください。

e4_default_mac.css

の値(CSS)を変更して保存→Eclipseを起動させます。

@import url(“e4_basestyle.css”);

.MTrimmedWindow {

background-color: #000000;

}

.MPartStack {

swt-simple: false;

swt-mru-visible: false;

swt-tab-renderer: url(bundleclass://org.eclipse.e4.ui.workbench.renderers.swt/org.eclipse.e4.ui.workbench.renderers.swt.CTabRendering);

swt-unselected-tabs-color: #0f0700 #070707 #00070f 100% 100%;

swt-outer-keyline-color: #007f00;

swt-inner-keyline-color: #003f00;

swt-mru-visible: false;

swt-shadow-visible: false;

swt-tab-outline: #3f0000;

}

.MPlaceholder {

background-color: #070707;

color: #ffffff;

}

.MTrimBar {

background-color: #070707;

}

.MTrimBar CLabel {

color: #ffaf00;

}

.MToolControl CLabel {

color: #ffaf00;

}

.MTrimBar#org-eclipse-ui-main-toolbar {

background-color: #0f0000 #0f0f0f #00000f 100% 100%;

}

.MPartStack.active {

swt-unselected-tabs-color: #070707 #3f0000 100% 100%;

swt-outer-keyline-color: #007f00;

swt-inner-keyline-color: #003f00;

swt-shadow-visible: false;

swt-tab-outline: #00003f;

}

PerspectiveSwitcher {

background-color: #0f0000 #0f0f0f #00000f 100% 100%;

eclipse-perspective-keyline-color: #000;

color: #ffffff;

}

org-eclipse-ui-editorss {

swt-unselected-tabs-color: #3f0000 #070707 #070707 100% 100%;

swt-outer-keyline-color: #007f00;

swt-inner-keyline-color: #003f00;

swt-tab-outline: #000;

color: #ffffff;

swt-tab-height: 8px;

padding: 0px 5px 7px;

}

org-eclipse-jdt-ui-PackageExplorer {

background-color: #070707;

color: #ffffff;

}

CTabFolder {

swt-tab-renderer: url(bundleclass://org.eclipse.e4.ui.workbench.renderers.swt/org.eclipse.e4.ui.workbench.renderers.swt.CTabRendering);

swt-unselected-tabs-color: #0f0f0f;

swt-outer-keyline-color: #007f00;

swt-inner-keyline-color: #003f00;

swt-tab-outline: #3f0000;

selected-tab-fill: #3f3f3f;

swt-shadow-visible: false;

}

CTabFolder Tree {

background-color: #070707;

color: #ffdf7f;

}

CTabFolder Canvas {

background-color: #070707;

color: #ffdf7f;

}

CTabItem {

background-color: #070707;

color: #ff7f3f;

}

CTabItem:selected {

color: #ffffff;

}

Label {

/*color: #ffdf7f;*/

color: #0C27E8;

}

エディタのところでマウスポインタを持って行き
右クリック→【設定】をクリック

一般→外観→テーマから

【Mac】を選択

エディタの中だけでなく
フレーム(枠)も黒くなりました。

白よりも黒のほうが目にやさしく

長時間細かな文字を見続けることが出来ます。

気分を変えたい方は
試してみてくださいね。
Eclipse 4.3ではじめるJavaプログラミング入門

Eclipse 4.3ではじめるJavaプログラミング入門