Как найти элементы на странице?

В предыдущем посте мы рассмотрели высокоуровневую архитектуру Selenium-приложений. Этот пост будет посвящен поиску элементов на веб-странице для взаимодействия с ними.

Сначала мы должны найти элементы на странице, чтобы выполнить над ними некоторые операции. Мы можем найти элементы по атрибуту id, атрибуту name, селектору css, имени класса, имени тега, xpath и полному или частичному тексту ссылки.

Поиск стратегий

Python API предоставляет следующие методы для поиска элементов на странице.

  • find_element_by_id
  • find_element_by_name
  • find_element_by_xpath
  • find_element_by_link_text
  • find_element_by_partial_link_text
  • find_element_by_tag_name
  • find_element_by_class_name
  • find_element_by_css_selector

Эти методы возвращают объект типа WebElement (представляет конкретный узел DOM) или повышают значение NoSuchElementException, если он не найден.

Вы также можете найти несколько элементов с помощью следующих версий методов поиска.

  • find_elements_by_id
  • find_elements_by_name
  • find_elements_by_xpath
  • find_elements_by_link_text
  • find_elements_by_partial_link_text
  • find_elements_by_tag_name
  • find_elements_by_class_name
  • find_elements_by_css_selector

Эти методы возвращают коллекцию элементов. Если найден только один элемент, он все равно вернет список (из одного элемента). Если ни один элемент не может быть найден, возвращается пустой список.

Есть еще два метода, которые вы можете использовать с помощью класса By.

  • find_element
  • find_elements

Атрибуты, доступные для По классу:

  • ID
  • XPATH
  • LINK_TEXT
  • PARTIAL_LINK_TEXT
  • NAME
  • TAG_NAME
  • CLASS_NAME
  • CSS_SELECTOR

Они используются, как в приведенном ниже фрагменте кода.

from selenium.webdriver.common.by import By
element = driver.find_element(By.ID, "main_content")
list_of_elements = driver.find_elements(By.CLASS_NAME, "links")

Все методы find_* могут быть вызваны как для WebDriver, так и для WebElementэкземпляров. Это означает, что если вы найдете элемент контейнера, вызвав метод find_* для экземпляра WebDriver, вы сможете вызвать find_* для этого элемента для дальнейшего поиска элементов внутри него.

Пример

Следующий пример включает все стратегии определения местоположения и обработку случая NoSuchElementException.

Вы также можете найти коды здесь.

# Output
Mail input field placeholder: [email protected]
Submit button text: SUBMIT QUESTION
Second link text: Hitchhiker’s Guide to Python
Python Official link text: Python Official
Link text - 1: Python Official
Link text - 2: Hitchhiker’s Guide to Python
Link text - 3: Dive Into Python
Link text - 4: Real Python
Link text - 5: Python Subreddit
Link text - 6: Talk Python Podcast
Link text - 7: Awesome Python
Question text area placeholder: Your question...
Navigation item - 1: About
Navigation item - 2: BOPI
Navigation item - 3: Feedback
Support button text: Support Me
There is no h1 tag in the document!

Советы по повышению эффективности

  • Если для элемента, который нужно найти, доступен идентификатор, предпочтительнее использовать его. Поскольку идентификатор должен быть уникальным на странице, производительность будет выше.
  • Если id недоступен, предпочтите хорошо написанный целевой селектор css.
  • Обход DOM — дорогостоящая операция, поэтому вам следует максимально сузить область поиска, чтобы повысить производительность.

То, что нужно запомнить

  • Вы можете найти элементы по атрибуту id, атрибуту имени, селектору css, имени класса, имени тега, xpath и полному или частичному тексту ссылки.
  • Selenium Python API предоставляет методы find_element(s) и find_element(s)_by_* для поиска элементов на странице.
  • Все методы find_* можно вызывать как для WebDriver, так и для WebElementэкземпляров.
  • В случае неудачи эти методы возвращают пустой список или поднимают NoSuchElementException

В следующем посте я напишу об ожиданиях в Selenium.

использованная литература

  1. https://www.selenium.dev/documentation/en/getting_started_with_webdriver/locating_elements/
  2. https://selenium-python.readthedocs.io/locating-elements.html
  3. https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Selectors

Спасибо за уделенное время.

Если вы хотите прочитать предыдущие сообщения, перейдите по следующим ссылкам.