2024年6月5日 / 最終更新日時 : 2024年6月5日イプシロン VBA

【selenium/webスクレイピング/VBA】タブの指定方法について

みなさんこんにちは。

Webスクレイピングをする際、

サイト内のタブなどのクリックする動作があるかと思います。

その際、直接Xpathを指定してクリックするのが簡単ですが、

サイトの状態によっては、ログインアカウントによって

タブの位置が変わったりして予期せぬ動作をすることがあります。

そこで今回はタブの位置と名称が一致した状態でクリックをする方法について解説します。

（すこしニッチな内容になりますがw）

この記事はこんな人におすすめ

この記事はこんな人におすすめです！

VBAプログラミング：初級者～中級者
Webスクレイピング初学者
コードだけサクッと取得したい人

クリックの位置を指定するメリット

クリックの位置を指定するメリットは以下のとおりです。

環境ごとに変動する内容にも適用できる
可読性が向上される
アップデートによるサイト構成の変更にも適用できる

手順

ボタンを用意する

「開発」リボン→「挿入」→「ボタン」を選択します。

　マクロ名を編集し(仮に”Tab_Click_Macro”とします)、「新規作成」ボタンをクリックします。

コードを書く

ボタンをクリックしたときの処理を以下のようにします。

まずは、ブラウザを立ち上げる内容となります。

（今回はカードラッシュのサイトを参考にしてご説明します。）

【参考：カードラッシュのサイトについて知りたい人】

' ボタンクリック時の処理
Sub Tab_Click_Macro()
    Dim driver As New Selenium.WebDriver
    
    ' ブラウザを起動する
    driver.AddArgument "disable-gpu"
    driver.AddArgument "start-maximized"

    driver.Start "Chrome"  'クロームブラウザを立ち上げます。
    driver.Get "https://www.cardrush-pokemon.jp/"
        
    ' ブラウザを閉じる
    driver.Close
    Set driver = Nothing 'driveをリセットする
End Sub

実行するとサイトが立ち上がります。

赤枠部分の「状態表記」をクリックしたいと思います。

ちなみに、スクレイピングの環境構築については、過去のブログでも紹介させていただいております。

【selenium/webスクレイピング/VBA】VBAスクレイピングに必要な環境構築手順について

xPathを取得する

「Shift」+「Ctrl」+「C」でデベロッパーツールを立ち上げます。

「問い合わせ」にカーソルをあてて、左クリックをします。

ハイライトされたデベロッパーツールで右クリック→Copy→Copy full xpathをクリックします。

クリップボードにxpathが保存されているので、メモ帳などに張り付けます。

すると、以下のようなxpathが取得されています。

/html/body/div[1]/div/header/div/div/nav/div/div/ul/li[1]/a/span

同じ手順でタブ内の「利用案内」、「状態表記」のxpathを取得します。

xpathの内容は以下のようになります。

「問い合わせ」のxpath↓

/html/body/div[1]/div/header/div/div/nav/div/div/ul/li[1]/a/span

「利用案内」のxpath↓

/html/body/div[1]/div/header/div/div/nav/div/div/ul/li[2]/a/span

「状態表記」のxpath↓

/html/body/div[1]/div/header/div/div/nav/div/div/ul/li[3]/a/span

ちなみに一番右端の「ヴァンガ通販」のxpathは以下のようになります。

/html/body/div[1]/div/header/div/div/nav/div/div/ul/li[9]/a/span

添え字に着目する

お気付きの方もいらっしゃるかと思いますが。

タブの構成としては、”li[1]/a/span”のliの数値で指定することができます。

ループで場所を特定する

「左から3番目にある”状態表記”をクリックする」と厳密に指定する場合は、

以下のようなコードになります。

	Dim i As Long
	Dim strXpath As String
	Dim strText As String3
	For i = 1 To 9
	    strXpath = "/html/body/div[1]/div/header/div/div/nav/div/div/ul/li[" & Replace(i, " ", "") & "]/a/span"
	    strText = driver.FindElementByXPath(strXpath).Attribute("innerText")
	    If strText = "状態表記" Then
	        ' タブをクリックする
	        driver.FindElementByXPath(strXpath).Click
	        Stop ' 使用する際はStopを削除してください。
	    End If
	Next i

ポイント

liの添え字にReplace(i, ” “, “”)を記述していますが、ここがかなりポイントになります。

変数のみ添え字にすると、値の前に半角スペースが含まれているため、

実際に処理してみるとうまく判別されません。

そのため必ず、Replace(i, ” “, “”)を記述して半角スペースを消す処理を含ませる必要があります。

検証

ボタンをクリックするとブラウザが起動し、

「状態表記」をクリックしていることが確認できます。

コード全体(完成形)

最終的なコード全体は以下の通りになります。

' ボタンクリック時の処理
Sub Tab_Click_Macro()
    Dim driver As New Selenium.WebDriver
    
    ' ブラウザを起動する
    driver.AddArgument "disable-gpu"
    driver.AddArgument "start-maximized"

    driver.Start "Chrome"  'クロームブラウザを立ち上げます。
    driver.Get "https://www.cardrush-pokemon.jp/"
    
    Dim i As Long
    Dim strXpath As String
    Dim strText As String
    For i = 1 To 9
        strXpath = "/html/body/div[1]/div/header/div/div/nav/div/div/ul/li[" & Replace(i, " ", "") & "]/a/span"
        strText = driver.FindElementByXPath(strXpath).Attribute("innerText")
        If strText = "状態表記" Then
            ' タブをクリックする
            driver.FindElementByXPath(strXpath).Click
            Stop
        End If
    Next i
    
    ' ブラウザを閉じる
    driver.Close
    Set driver = Nothing 'driveをリセットする
End Sub