XPathについての基本です。
1. XPathとは
XPath（XML Path Language）は、XML文書で特定の部分を指定する構文です。HTMLもXPathを使用し、要素を指定することができます。コボットでは、ブラウザ操作関連のアクティビティで、操作対象となるUI（ユーザーインターフェース）要素を指定する場合に使用します。
2. XPathの構文
XPathではXML文章をツリーとして捉えることで、要素や属性の位置を指定することができます。URLのように「/」で要素などをつなげて記述します。既存ページのXPathを取得し、構文を見ていきましょう。
Google ChromeでXPath を取得
Chromeに搭載されている「デベロッパーツール」を使用し、コボットPortalのサイト上にある「コボットの使い方」の部分を指定するXPathを取得します。
ChromeでコボットPortalのトップページを開きます。
トップページの「コボットの使い方」の空白部分で右クリックし（●の付近など）、コンテキストメニューから「検証(I)」をクリックします。
「デベロッパーツール」が表示され、「コボットの使い方」部分の要素が青くハイライトされます。ハイライトされた箇所で右クリックします。
「Copy」>「Copy XPath」をクリックします。これでXPathがクリップボードにコピーされました。
※ここではブラウザの右側に表示されていますが、設定によってデベロッパーツールがブラウザの左側や下部、別ウィンドウで表示される場合もあります。ブラウザの右側に表示したい場合、デベロッパーツールの右上にある 
（Customize and control DevTools）をクリックし、「Dock side」一番右側のアイコン「Dock to right」をクリックします。
取得したXPathの確認
メモ帳などを使用し、クリップボードに取得したXPathを見ていきましょう。
//*[@id="custom-blocks"]/div/div/div[2]/a
このXPathは簡略化された記述方法になります。XPathはHTML文書をツリー構造と捉え、「/」で要素などをつなげて位置を指定すると説明しました。このページをツリー構造にした時の要素「コボットの使い方」は、ルートから記述すると以下のようになります。
/html/body/div[2]/div[1]/div/div/div[2]/a
意味としては「html要素の直下の、body要素の直下の、2番目のdivの…」のようになります。
| ※簡略化しないXPathもデベロッパーツールを使用し取得可能です。 取得方法は、XPathのコピーで『「Copy」>「 Copy XPath」』ではなく、 『「Copy」>「 Copy full XPath」』となります。 |
簡略化されたXPathの構文を見ていきます。
■ //*[@id="custom-blocks"]/div/div/div[2]/a
「//」は子孫要素を意味し、「*」は、すべての子要素を意味します。
「//*」で「ドキュメント内のすべての要素」を表します。
■ //*[@id="custom-blocks"]/div/div/div[2]/a
「@」は属性名の接頭辞で、要素に紐づく属性を指定する場合に使用します。
「=」はイコール演算子です(代入ではありません)。囲っている「 [ ] 」は、条件式を記述する場合に使用します。この部分で「id属性が"custom-blocks"の要素」を指定しています。
■ //*[@id="custom-blocks"]/div/div/div[2]/a
「/」は直下の要素という意味で、「『/』より前に記述された要素の直下にあるdiv要素」を指定しています。
取得したXPath //*[@id="custom-blocks"]/div/div/div[2]/a は、
「このページで、id属性が"custom-blocks"の要素の直下にあるdiv要素で囲われたa要素」を指定しています。