Webサイト上からデータを自動的に取得するには2つの方法があります。1つはPythonなどのプログラミング言語でWebクローラーを作る、もう1つはOctoparseのようなWebスクレイピングツールでデータを取得するのです。しかし、どれにしても、XPathは重要な役割を果たしています。XPathの書き方が分かれば、データをより正しくて効率的に取得できます。

それでXPathのシリーズではXPathの基本概念からXPathの書き方、応用まで詳しく紹介したいと思います。

この記事では、XPathの基本概念を簡単に紹介します。

1. XPathとは？

XPath (XML Path Language)とは、ツリー構造となっているXML/HTMLドキュメントからの要素や属性値などを指定するための簡潔な構文(言語)です。
Webページは通常HTMLで記述されるから、XPathはWebページの情報を取得する時によく利用します。ブラウザ（Chrome、Firefoxなど）でWebページのHTMLを表示するする場合、F12キーを押すことで、対応するHTMLドキュメントに簡単にアクセスできます。

2. XPathの仕組み

XPathは具体的にはどのように動作するのかを見てみましょう。下記の画像はHTMLドキュメントの一部です。

HTMLは、ツリー構造のように、異なるレベルのがあります。この例では、レベル1はbookstoreで、レベル2は
bookです。Title、author、year、priceはすべてレベル3です。

山括弧（など）を含むテキストはタグと呼ばれます。HTMLの要素は通常、開始タグと終了タグで構成され、その間にコンテンツが挿入されます。以下の形になります。

<○○>(開始タグ)ここにコンテンツが入ります... </○○>(終了タグ)

XPathはスラッシュ “/” で区切りながら階層を記述し、基準となるノードから別のノードを指定できます。URLと似ています。この例では、要素「author」を検索する場合、XPathは次のようになります。

/bookstore/book/author

それがどのように機能するかをよりよく理解するには、コンピューター上の特定のファイルを見つける方法を参照してください。

「author」という名前のファイルを見つけるには、正しいファイルパスは \ bookstore \ book \ authorです。

コンピューター上のすべてのファイルには独自のパスがあるように、Webページ上の要素もパスがあります。そのパスはXPathで記述されています。

ルート要素（ドキュメントの一番上の要素）から始まり、中にあるすべての要素を経由して目標要素に至るXPathは、絶対XPathと呼ばれます。

例：　/html/body/div/div/div/div/div/div/div/div/div/span/span/span…

絶対XPathは長くて混乱する可能性があるため、絶対XPathを単純化するために、「//」を使用して途中までのパスを省略することができます（短いXPathとも呼ばれる）。

たとえば、

絶対XPath：　　/bookstore/book/author
短いXPath：　　//author

3. XPathを表示・書くには

【Google Chromeの場合】

Chromeでこのページを表示し、右クリックメニューの[検証]から開発者ツールを表示します。Elementタブのhtmlで、要素を右クリックします。メニューの[Copy] → [Copy XPath ] でその要素を取得するためのXPathがクリップボードにコピーされます。

表示されているElementタブのhtmlから “Ctrl + F” で検索欄を表示します。XPathを入力すると、得られる要素が選択されるはずです。

また、「XPath Helper」という拡張機能を追加することもできます。XPathを入力すると、一致する結果が表示されます。（XPath Helperをインストールする)

​

【Firefoxの場合】　

Firefoxの旧バージョンに搭載されている拡張機能「Firebug」が利用できます。（Firebug&FireXPath拡張機能をインストールする方法)

FirefoxでWebページを開く➡Firebugボタンをクリック➡ページ内の要素をクリック➡その要素のXPathが表示されます。

以上はXPathの基本概念でした。次回はXPathの書き方を紹介しますので、お楽しみにしてください！

元記事：https://helpcenter.octoparse.jp/hc/ja/articles/360015765513