Yahoo!Pipesの「XPath Fetch Page」で、うまく取得できないときの対処法

Yahoo!Pipesの「XPath Fetch Page」でXpathを指定する際に、要素に複数のclassが指定されている場合とidやclass属性が指定されていない場合の対処法について解説します。

初めて「XPath Fetch Page」を使う方は、Yahoo!Pipesの新モジュール「XPath Fetch Page」の基本的な使い方を参照してください。

複数のクラス属性が指定されている場合

たとえば、以下のようなHTML文書があるとします。

<div class=”foo bar”></div>

このdiv要素をXpathで取得したい場合、あなたならどうしますか?

1. クラス名を1つだけ選んで指定する
   //div[@class=”foo”] or //div[@class=”bar”]
2. まとめて指定する
   //div[@class=”foo bar”]

上記のような指定の仕方を考えるかもしれません。残念ながらPipesでは、どちらもエラーが出てうまく取得できません。

このように複数のクラスが指定さている場合は、Xpathにあらかじめ用意されている関数を使います。contains()という関数です。

contanins(‘str1’,’str2’) : str1にstr2が含まれていれば true を返し、そうでなければ false 返します

つまり、先ほどの例では

//div[contains(@class,”foo”)] or //div[contains(@class,”bar”)]

と指定すればOKです。

実際にやってみましょう。MOVIE Collectionという映画サイトにあるNews一覧ページのRSSフィードを作成してみたいと思います。

作成するPipesの完成形

取得範囲を決める

「Firebug」やChrome「Webデベロッパーツール」の「要素の検証」を使います。

<div class="kiji clear">

という要素を指定すればうまくいきそうです。今回は画像や日付は不要なので、このdiv要素の直下であるa要素のみを指定したいと思います。

Xpathは、クラス属性に kiji という文字列含まれている要素の子供のa要素を指定すればいいので

//div[contains(@class,”kiji”)]/a

と指定します。

Yahoo!Pipesでモジュールを組み立てる

「XPath Fetch Page」モジュールには以下のように指定します。

URL : http://www.moviecollection.jp/news/
Extract using Xpath : //div[contains(@class,"kiji")]/a
Use HTML5 parser にチェック

Renameモジュールについては割愛します。

今回の完成形はこちらです。

idやclass属性が指定されていない場合

取得したい要素の範囲内にid属性やclass属性が指定さていない場合は、「番号」を使うとうまくいくケースがあります。

実際のページで考えてみましょう。東スポＷebの人気ランキング一覧にアクセスしてください

取得範囲を決める

このページには6つのランキングが用意されています。

Firebugなどで調べると、それぞれがol要素でマークアップされていることがわかります。PipesでRSSフィードを作成する場合は、ol要素の子孫にあたるa要素を指定すればうまくいきそうです。

ですが、6つのランキングのうち「エンタメ人気ランキング」のみを取得したい場合はどうすればいいでしょうか？

//ol/li/a

と指定した場合は、6つのランキングすべてが取得されてしまいます。「総合人気ランキング」や「スポーツ人気ランキング」も余計に含まれてしまうわけです。

このようなときに便利なのが「番号」です。以下のように書き換えます。

//ol[4]/li/a

と指定すると、4番目に登場したol要素の子孫のa要素のみに限定して取得することができます。

Yahoo!Pipesでモジュールを組み立てる

「XPath Fetch Page」モジュールには以下のように指定します。

URL : http://www.tokyo-sports.co.jp/rankinglist/
Extract using Xpath : //ol[4]/li/a
Use HTML5 parser にチェック

Renameモジュールについては割愛します。

今回の完成形はこちらです。

関連記事

• Yahoo!PipesのFilterモジュールの使い方
• Yahoo!Pipesの新モジュール「XPath Fetch Page」の基本的な使い方