selenium

[Python] seleniumでページ読み込みを待機してからクリックする方法

2025-01-18更新日: 2025-01-18

Seleniumでページの読み込みを待機してからクリックするには、WebDriverWaitを使用します。

WebDriverWaitは指定した条件が満たされるまで待機する機能を提供します。

例えば、element_to_be_clickableを使うと、要素がクリック可能になるまで待機できます。

これにより、ページの読み込みが完了し、要素が操作可能になったタイミングでクリックを実行できます。

目次から探す

明示的待機を使ったクリック操作
暗黙的待機を使ったクリック操作
ページの特定要素が表示されるまで待機する方法
JavaScriptを使ったページ読み込み完了の確認
応用例：動的コンテンツの待機とクリック
まとめ

明示的待機を使ったクリック操作

Webページの要素が読み込まれるまで待機する方法の一つに、明示的待機があります。

これにより、特定の条件が満たされるまで処理を一時停止し、要素が利用可能になった時点で操作を行うことができます。

WebDriverWaitのインポート方法

明示的待機を使用するためには、まずWebDriverWaitをインポートする必要があります。

以下のようにインポートします。

from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC

element_to_be_clickableの使い方

element_to_be_clickableは、指定した要素がクリック可能になるまで待機するための条件です。

以下のように使用します。

element = WebDriverWait(driver, 10).until(
    EC.element_to_be_clickable((By.ID, 'element_id'))
)

このコードは、指定したIDの要素がクリック可能になるまで最大10秒間待機します。

presence_of_element_locatedとの違い

presence_of_element_locatedは、要素がDOMに存在することを確認するための条件です。

要素が表示されているかどうかは確認しません。

以下のように使います。

element = WebDriverWait(driver, 10).until(
    EC.presence_of_element_located((By.ID, 'element_id'))
)

この場合、要素が存在することは確認されますが、クリック可能かどうかは確認されません。

タイムアウトの設定方法

WebDriverWaitのタイムアウトは、待機する最大時間を設定するために使用します。

以下のように設定できます。

wait = WebDriverWait(driver, 10)  # 10秒のタイムアウト

この設定により、指定した条件が満たされるまで最大10秒間待機します。

クリック操作の実装例

以下は、明示的待機を使用して要素をクリックする実装例です。

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
# WebDriverの初期化
driver = webdriver.Chrome()
# 指定したURLにアクセス
driver.get('https://example.com')
# 要素がクリック可能になるまで待機
element = WebDriverWait(driver, 10).until(
    EC.element_to_be_clickable((By.ID, 'element_id'))
)
# 要素をクリック
element.click()
# WebDriverを終了
driver.quit()

このコードでは、指定したURLにアクセスし、IDがelement_idの要素がクリック可能になるまで待機してからクリックします。

出力結果は特に表示されませんが、要素が正常にクリックされると、次のページに遷移するなどの動作が行われます。

暗黙的待機を使ったクリック操作

暗黙的待機は、Seleniumで要素が見つかるまでの待機時間を設定する方法です。

この方法では、指定した時間内に要素が見つからない場合、エラーが発生します。

暗黙的待機を使用することで、コードがシンプルになり、待機時間を明示的に指定する必要がなくなります。

暗黙的待機の設定方法

暗黙的待機は、WebDriverのインスタンスを作成した後に設定します。

以下のように設定できます。

from selenium import webdriver
# WebDriverの初期化
driver = webdriver.Chrome()
# 暗黙的待機の設定(10秒)
driver.implicitly_wait(10)

この設定により、要素が見つかるまで最大10秒間待機します。

暗黙的待機のメリットとデメリット

メリット	デメリット
コードがシンプルになる	全ての要素に対して適用される
明示的な待機を使わなくて済む	待機時間が長くなる可能性がある
簡単に設定できる	特定の要素に対して柔軟性がない

暗黙的待機は、全ての要素に対して適用されるため、特定の要素に対して異なる待機時間を設定したい場合には不向きです。

暗黙的待機を使ったクリック操作の実装例

以下は、暗黙的待機を使用して要素をクリックする実装例です。

from selenium import webdriver
from selenium.webdriver.common.by import By
# WebDriverの初期化
driver = webdriver.Chrome()
# 暗黙的待機の設定(10秒)
driver.implicitly_wait(10)
# 指定したURLにアクセス
driver.get('https://example.com')
# 要素をクリック
element = driver.find_element(By.ID, 'element_id')
element.click()
# WebDriverを終了
driver.quit()

このコードでは、指定したURLにアクセスし、IDがelement_idの要素を暗黙的待機を使ってクリックします。

要素が見つかるまで最大10秒間待機し、見つかった時点でクリック操作が行われます。

出力結果は特に表示されませんが、要素が正常にクリックされると、次のページに遷移するなどの動作が行われます。

ページの特定要素が表示されるまで待機する方法

Webページの特定の要素が表示されるまで待機することは、Seleniumを使用する際に非常に重要です。

要素が表示されるまで待機することで、操作が失敗するリスクを減らすことができます。

ここでは、いくつかの条件を使った待機方法を紹介します。

visibility_of_element_locatedの使い方

visibility_of_element_locatedは、指定した要素がDOMに存在し、かつ表示されていることを確認するための条件です。

以下のように使用します。

from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
# 要素が表示されるまで待機
element = WebDriverWait(driver, 10).until(
    EC.visibility_of_element_located((By.ID, 'element_id'))
)

このコードは、指定したIDの要素が表示されるまで最大10秒間待機します。

element_to_be_selectedの使い方

element_to_be_selectedは、指定した要素が選択されているかどうかを確認するための条件です。

主にチェックボックスやラジオボタンに使用されます。

以下のように使います。

# 要素が選択されるまで待機
element = WebDriverWait(driver, 10).until(
    EC.element_to_be_selected((By.ID, 'checkbox_id'))
)

このコードは、指定したIDのチェックボックスが選択されるまで最大10秒間待機します。

element_to_be_visibleの使い方

element_to_be_visibleは、要素が表示されているかどうかを確認するための条件です。

以下のように使用します。

# 要素が表示されるまで待機
element = WebDriverWait(driver, 10).until(
    EC.visibility_of_element_located((By.XPATH, '//div[@class="example"]'))
)

このコードは、指定したXPathの要素が表示されるまで最大10秒間待機します。

要素が表示されるまで待機してクリックする実装例

以下は、特定の要素が表示されるまで待機し、その後クリックする実装例です。

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
# WebDriverの初期化
driver = webdriver.Chrome()
# 指定したURLにアクセス
driver.get('https://example.com')
# 要素が表示されるまで待機
element = WebDriverWait(driver, 10).until(
    EC.visibility_of_element_located((By.ID, 'element_id'))
)
# 要素をクリック
element.click()
# WebDriverを終了
driver.quit()

このコードでは、指定したURLにアクセスし、IDがelement_idの要素が表示されるまで待機してからクリックします。

要素が正常にクリックされると、次のページに遷移するなどの動作が行われます。

出力結果は特に表示されませんが、要素が正しく操作されることが期待されます。

JavaScriptを使ったページ読み込み完了の確認

Seleniumを使用してWebページを操作する際、ページの読み込みが完了するのを確認することは非常に重要です。

JavaScriptを使ってページの状態を確認する方法を紹介します。

document.readyStateを使った待機方法

document.readyStateは、ページの読み込み状態を確認するためのJavaScriptのプロパティです。

このプロパティは、ページが完全に読み込まれたかどうかを確認するのに役立ちます。

以下のように使用します。

from selenium import webdriver
import time
# WebDriverの初期化
driver = webdriver.Chrome()
# 指定したURLにアクセス
driver.get('https://example.com')
# ページが完全に読み込まれるまで待機
while driver.execute_script("return document.readyState;") != "complete":
    time.sleep(1)  # 1秒待機

このコードでは、document.readyStateがcompleteになるまで1秒ごとに確認し続けます。

JavaScriptを使った待機のメリットとデメリット

メリット	デメリット
ページの読み込み状態を正確に確認できる	JavaScriptが無効な場合、機能しない
他の待機方法と併用可能	コードが複雑になる可能性がある
特定の条件に基づいて待機できる	すべての要素に対して適用できない

JavaScriptを使った待機は、ページの状態を正確に確認できるため、特に動的なコンテンツが多いページで有効です。

JavaScriptを使ったクリック操作の実装例

以下は、JavaScriptを使ってページの読み込みが完了した後に要素をクリックする実装例です。

from selenium import webdriver
from selenium.webdriver.common.by import By
import time
# WebDriverの初期化
driver = webdriver.Chrome()
# 指定したURLにアクセス
driver.get('https://example.com')
# ページが完全に読み込まれるまで待機
while driver.execute_script("return document.readyState;") != "complete":
    time.sleep(1)  # 1秒待機
# 要素をクリック
element = driver.find_element(By.ID, 'element_id')
element.click()
# WebDriverを終了
driver.quit()

このコードでは、指定したURLにアクセスし、ページが完全に読み込まれるまで待機した後、IDがelement_idの要素をクリックします。

出力結果は特に表示されませんが、要素が正常にクリックされると、次のページに遷移するなどの動作が行われます。

応用例：動的コンテンツの待機とクリック

動的コンテンツを扱う際には、要素が表示されるまで待機する方法が特に重要です。

ここでは、Ajaxを使ったページ、無限スクロール、ポップアップ、フレームやiframe内の要素に対する待機とクリックの方法を紹介します。

Ajaxを使ったページの待機方法

Ajaxを使用して動的にコンテンツが読み込まれるページでは、要素が表示されるまで待機する必要があります。

以下のように、特定の要素が表示されるまで待機することができます。

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
# WebDriverの初期化
driver = webdriver.Chrome()
# 指定したURLにアクセス
driver.get('https://example.com/ajax-page')
# Ajaxで読み込まれる要素が表示されるまで待機
element = WebDriverWait(driver, 10).until(
    EC.visibility_of_element_located((By.ID, 'ajax_element_id'))
)
# 要素をクリック
element.click()
# WebDriverを終了
driver.quit()

このコードでは、Ajaxで読み込まれる要素が表示されるまで最大10秒間待機し、その後クリックします。

無限スクロールページでの待機とクリック

無限スクロールのページでは、スクロールすることで新しいコンテンツが読み込まれます。

以下のように、スクロールを行いながら要素が表示されるのを待機することができます。

from selenium import webdriver
from selenium.webdriver.common.by import By
import time
# WebDriverの初期化
driver = webdriver.Chrome()
# 指定したURLにアクセス
driver.get('https://example.com/infinite-scroll')
# スクロールして要素が表示されるまで待機
while True:
    driver.execute_script("window.scrollTo(0, document.body.scrollHeight);")
    time.sleep(2)  # 2秒待機
    # 要素が表示されたか確認
    try:
        element = driver.find_element(By.ID, 'infinite_element_id')
        element.click()
        break  # 要素が見つかったらループを抜ける
    except:
        continue  # 要素が見つからなければ再度スクロール
# WebDriverを終了
driver.quit()

このコードでは、無限スクロールのページで要素が表示されるまでスクロールを繰り返し、要素が見つかった時点でクリックします。

ポップアップやモーダルウィンドウの待機とクリック

ポップアップやモーダルウィンドウが表示される場合、これらの要素が表示されるまで待機する必要があります。

以下のように実装できます。

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
# WebDriverの初期化
driver = webdriver.Chrome()
# 指定したURLにアクセス
driver.get('https://example.com/popup')
# ポップアップが表示されるまで待機
popup = WebDriverWait(driver, 10).until(
    EC.visibility_of_element_located((By.ID, 'popup_id'))
)
# ポップアップ内のボタンをクリック
button = popup.find_element(By.ID, 'button_id')
button.click()
# WebDriverを終了
driver.quit()

このコードでは、ポップアップが表示されるまで待機し、その後ポップアップ内のボタンをクリックします。

フレームやiframe内の要素を待機してクリックする方法

フレームやiframe内の要素にアクセスする場合、まずそのフレームに切り替える必要があります。

以下のように実装できます。

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
# WebDriverの初期化
driver = webdriver.Chrome()
# 指定したURLにアクセス
driver.get('https://example.com/iframe')
# フレームに切り替え
driver.switch_to.frame('frame_id')
# 要素が表示されるまで待機
element = WebDriverWait(driver, 10).until(
    EC.visibility_of_element_located((By.ID, 'iframe_element_id'))
)
# 要素をクリック
element.click()
# フレームから元のコンテンツに戻る
driver.switch_to.default_content()
# WebDriverを終了
driver.quit()