このセクションの記事

Octoparse XPathツール

  • 更新
フォローする

Octoparseの利用でXPathの変更を習得するは、正確なデータスクレイピングのために不可欠なスキルです。Octoparse XPathツールは、正しいXPathを書いてチェックすることができます。ほんの少しの努力で、仕事の効率を大幅にアップさせることができます。

このチュートリアルでは、Octoparse XPathツールの使い方をご紹介します。この記事を読む前に、まずHTMLとXPathの基本を理解する必要があります。

（HTML__.pngとXPath__.pngに関する他のチュートリアル）

 

Octoparse XPathツールにアクセスするには2つの方法があります。

オプション1：

  • カスタマイズしたいデータフィールドを選択します。
  • 「データフィールドをカスタマイズする]をクリックします。
  • 「XPathをカスタマイズする」をクリックします。
  • 「XPathツールを試す」をクリックします。

01_____1.gif

 

オプション2：

  • サイドバーメニューのナビゲーションから「ツール」を選択します
  • 「XPathツール」をクリックします。

02_____2.gif

 

Octoparse XPathツールは、4つの主要部分から構成されています。

 03-4______.png

 

1）ブラウザ

（オプション1）タスク作成画面から直接XPathツールを起動すると、XPathツールのブラウザーは現在のページが自動的に読み込まれます。

（オプション2）サイドバーメニューからXPathツールを開くと、XPathツールはOctoparseのホームページ（http://www.octoparse.jp/）を読み込みます。その後、内蔵ブラウザに取得先のURLを入力して「開く」をクリックします。それから、Webページのコンテンツが自動的に読み込まれます。

2）HTML /マッチ

「HTML」タブで対応するソースコードが表示されています。もちろん、ChromeやFirefoxなどのブラウザを利用して、もっと読みやすいソースコードを読むことができます。XPathが生成されたら、「マッチする」タブをクリックして一致したコンテンツを見つけることができます。

3）XPath設定/参考文献/サンプル

「自動生成」タブには、いくつかオプションと入力ボックスがあります。オプションを選択してから、その後ろの入力ボックスにパラメータを入力し「生成」ボタンをクリックすると、XPathが自動的に生成できます。

また、「参考文献」タブをクリックしてXPathに関するチュートリアルが読めます。「サンプル」タブをクリックしてW3Schools.comでXPathの例を見ることもできます。

4）XPathの結果

「XPath」ボックスに自動的に生成されたXPathでこの要素がWebページで見つけられるかどうかを確認するためには「マッチする」ボタンをクリックする必要があります。

 

「自動生成」タブの各オプションの簡単な紹介。

  • 要素タグ名：

「アイテムタグ名」とは、ソースコード内にあるSPAN、AやDIVなどの青色（Chromeでは紫色）のテキストで、Firefoxブラウザのタグ名を説明します。XPathに特定のタグ名を含める場合は、「要素タグ名」のチェックボックスをオンにします。Octoparseはあなたが記入したタグ名で始まるすべての要素が見つけられるXPathを生成します。

Firefox:

04Firefox.png

Chrome:

 

 05Chrome.png

例えば、 「要素タグ名」をクリックして 、「要素位置」の入力ボックスに 「1」を入力して、要素名に「span」を入力して「生成する」ボタンをクリックすると、XPath式「// SPAN [1]」が得られます。「span」という名前の要素をすべて見つけることができます。

  • 要素位置：

「要素位置」とは、すべての兄弟でターゲット要素の位置です。デフォルト値は1、つまり兄弟の間の最初の項目です。3番目の要素を選択したい場合は、パラメータを「3」に設定します。もちろん、任意の項目も選択できます。

  • 要素ID、要素名、要素属性：

場合によっては、タグ要素には、「id」属性、「name」属性や「class」属性などの属性が含まれます。

3つの属性のいずれかを持つ要素を見つけるには、チェックボックスをオンにして正しい値を入力するだけです。

例えば、「要素Class属性」を選択し、「section-result-opening-hours」と入力して「生成する」をクリックすると、ツールではXPath式「// * [@ class = 'section-result-opening-hours'」が生成されます。下のスクリーンショットの「Open until 1:00 AM」という情報のように、「class」属性に「section-result-opening-hours」という値を持つすべての要素が見つけられます。

 06__ID_________.png

  • 要素テキスト：

「要素テキスト」とは、タグ要素の内容を指します。内容が入力したテキストとまったく同じ内容の要素を検索する場合に使用できます。

たとえば、「要素テキスト」を選択して「Seafood」と入力し、「生成する」をクリックすると、XPath式「// * [text（）、 'Seafood']」が生成されます。Seafood」が見つかります。

このオプションを使用するときは、空白、句読点、全角、半角など、入力するすべてのテキストがソースコード内のテキストとまったく同じであることを確認する必要があります。そのため、正しいテキストを確実に入力するには、Chromeなどのブラウザでソースコードを表示し、元のソースコードからダブルクリックしてテキストをかっこ内にコピーします。

  • 要素テキストに含む文字：

「要素テキストに含む文字」は、必要なテキストを含むタグ要素を見つけるために使用されます。

たとえば、「要素テキストに含む文字」を選択し、「burger」と入力して「生成する」をクリックすると、XPath式「// * [contains（text（）、 'burger'）]」が表示されます。 "burger"というテキストが含まれている可能性があります。

  • 要素テキストに始める文字：

"要素テキストに始める文字"は、入力したテキストでコンテンツが始まる要素を見つけるために使用されます。

例えば、「要素テキストに始める文字」を選択し、「burger」と入力して「生成する」をクリックすると、XPath式「// * [starts-with（text（）、 'burger'）]」が表示されます。内容が "burger"で始まる要素はすべて見つけることができます。

  • 「サブ要素」ボタン：

XPath結果に「/」を生成して現在のXPath式の子ノードを選択するために使用します。

  • 「親」ボタン：

XPath結果に「/ parent ::」を生成して現在のXPath式の親ノードを選択するために使用します。

  • 「前へ」ボタン：

XPath結果に“ / previous-sibling ::”を生成して現在のXPath式の前のノードを選択するために使用します。

  • 「次へ」ボタン：

XPath結果に“ / following-sibling ::”を生成して、現在のXPath式の次のノードを選択するために使用します。

 

 この記事は役に立ちましたか？もしご不明な点がございましたら、いつでもお問い合わせください！

関連記事