Selenium（Python、Chrome）如何找到在开发工具中可见但在页面源代码中不可见的 web 元素？

Question

我需要使用Selenium单击带有 Python3 的网页中菜单中的第一项。

我设法使用 Selenium 登录并导航到所需页面，但我被卡住了：看起来 Selenium 在页面中找不到任何元素，除了body中的第一个div之外。

我试图通过ID 、 class 、 xpath 、 selector找到元素……问题可能与此无关。 我以为它可能是一个iframe ，但我需要的内容似乎并不在其中。

我想问题是我需要查找的元素在开发工具中可见，但在页面源代码中不可见，所以 Selenium 看不到它 - 这有意义吗？ 如果是这样，这可以解决吗？

from selenium import webdriver
from selenium.webdriver.common.by import By

driver = webdriver.Chrome()
self.driver.get("my site")

# log-in website and navigate to needed page
# [...]

# find element in page

# this works
first_div = driver.find_element(By.CSS_SELECTOR, "#app-wrapper")

# this does not work
second_div = driver.find_element(By.CSS_SELECTOR, "#app-wrapper > div.layout.flex.flex-col.overflow-x-hidden.h-display-flex.h-flex-direction-column.h-screen")

编辑

问题很可能是由于动态网页后来通过脚本附加了部分 DOM 树。 我下载了一个本地版本的page.html ，删除了 scripts ，并成功地在本地页面中找到了抢手的元素

from selenium import webdriver
from selenium.webdriver.common.by import By
from pathlib import Path

driver = webdriver.Chrome()

html_file = Path.cwd() / "page.html"

driver.get(html_file.as_uri())

my_element = driver.find_element(By.CSS_SELECTOR, "[title='my-title']")

完全相同的driver.find_element查询在在线页面上不起作用。 我正在尝试按照 Misc08 的回答中的建议实施等待条件。

Answer 1

我想问题是我需要查找的元素在开发工具中可见，但在页面源代码中不可见，所以 Selenium 看不到它 - 这有意义吗？ 如果是这样，这可以解决吗？

不，这没有意义，因为 Selenium 正在后台执行完整的浏览器，就像您使用开发工具调查页面源代码时所使用的那样。

但是你有一些选择来缩小你的问题。 您可以做的第一件事是打印 webdriver 在这一刻“看到”的源代码：

print(driver.page_source)

如果您在页面源代码中看到您正在寻找的元素，那么您应该尝试改进您的选择器。 go 一步步向下DOM很有帮助。 先在页面树中寻找上层元素。 如果可行，请尝试查找下一个子元素，然后是下一个子元素，依此类推。 您可以检查 selenium 是否找到了这样的元素：

try:
   myelement = driver.find_element(By.CSS_SELECTOR, 'p.content')
   print("Found :)")
except NoSuchElementException:
   print("No found :(")

顺便说一句，我认为你的 CSS 选择器到目前为止太复杂了，只需在 CSS class 上使用，而不是全部：

second_div = driver.find_element(By.CSS_SELECTOR, "#app-wrapper > div.layout")

但可能存在这样的情况，即您要查找的元素从一开始就不存在于页面源代码中。 动态网页越来越流行。 在这种情况下，稍后通过脚本附加 DOM 树的一部分。 所以你必须等待脚本的执行，然后才能找到这个“动态”元素。 一个肮脏且不可靠的选择是在此处添加一个 sleep() 。 更好的是使用显式等待条件，请参阅https://selenium-python.readthedocs.io/waits.html