[Selenium] Google Chrome を使って、簡単にXPATH、セレクターを調べる

2019年4月2日ITpython, Selenium

スクレイピングやテストでよく使用されるSeleniumですが、知りたいHTMLのタグに class や id が指定されてない時があります。

そんな時、Google Chrome の Developer Tool を使えば、XPATHやセレクター を簡単に知ることができます。

1. ホームページの余白を右クリック → 「検証」を選択

xpath-selector1.png

2. Developer Tools の矢印のマークを選択

xpath-selector2.png

3. XPATH、もしくはセレクターを知りたい箇所をクリック

4. ハイライトされている該当 HTML を右クリック → 「Copy」 → 「Copy Selector」 もしくは「Copy XPATH」を選択

xpath-selector3.png

軽く動かしてみましょう。
Yahoo! で Google を検索してみました。

・CSS セレクタを指定した場合

# coding:utf-8
from selenium import webdriver
from selenium.webdriver.common.keys import Keys
from time import sleep


# ブラウザを開く
driver = webdriver.Chrome()
# Yahoo! ホームページを開く
driver.get("https://www.yahoo.co.jp/")
# 検索語として「Google」と入力し、Enterキーを押す
driver.find_element_by_css_selector("#srchtxt").send_keys("Google")
# 検索ボタンクリック
driver.find_element_by_css_selector("#srchbtn").click()
# 10 秒停止
sleep(10)
# ブラウザを閉じる
driver.close()

・XPATH を指定した場合

# coding:utf-8
from selenium import webdriver
from selenium.webdriver.common.keys import Keys
from time import sleep


# ブラウザを開く
driver = webdriver.Chrome()
# Yahoo! ホームページを開く
driver.get("https://www.yahoo.co.jp/")
# 検索語として「Google」と入力し、Enterキーを押す
driver.find_element_by_xpath("//*[@id='srchtxt']").send_keys("Google")
# 検索ボタンクリック
driver.find_element_by_xpath("//*[@id='srchbtn']").click()
# 10 秒停止
sleep(10)
# ブラウザを閉じる
driver.close()

ひとこと

Selenium、ほんと便利ですね。Python、Ruby、JavaScript、Javaといろんな言語に対応してますし。

スポンサーリンク

Posted by nobuhiro harada