使用Selenium与BeautifulSoup无法定位单元格内容的技术问题

我刚接触网页抓取和Selenium、BeautifulSoup工具，尝试从指定页面抓取首个事故的日期。通过检查元素发现，日期文本位于slot属性值为vaadin-grid-cell-content-10的vaadin-grid-cell-content标签中，但使用Selenium的driver.find_element（XPath方式）及BeautifulSoup的.find方法均无法定位该元素。已通过Driver成功访问网站，相关代码如下：

driver.get("https://data.ntsb.gov/carol-main-public/query-builder?month=6&year=2024")

soup = BeautifulSoup(driver.page_source, 'html.parser')

element = soup.find('vaadin-grid-cell-content', {'slot': 'vaadin-grid-cell-content-10'})
date_text = element.text.strip()
print(date_text)

driver.quit()

可能的原因及解决办法 #

• 页面未完全加载：目标元素是Vaadin动态渲染组件，代码执行时页面还没加载完成，导致无法定位。
  • 解决：使用Selenium显式等待，等待元素出现后再操作：

    from selenium.webdriver.common.by import By
    from selenium.webdriver.support.ui import WebDriverWait
    from selenium.webdriver.support import expected_conditions as EC
    
    driver.get("https://data.ntsb.gov/carol-main-public/query-builder?month=6&year=2024")
    # 最长等待10秒，直到目标元素出现
    wait = WebDriverWait(driver, 10)
    date_element = wait.until(EC.presence_of_element_located((By.CSS_SELECTOR, 'vaadin-grid-cell-content[slot="vaadin-grid-cell-content-10"]')))
    date_text = date_element.text.strip()
    print(date_text)
    driver.quit()
    

• slot属性值动态变化：vaadin-grid-cell-content-10这类slot值可能随页面刷新改变，属于不稳定定位标识。
  • 解决：改用更稳定的定位逻辑，比如通过行/列位置或语义属性定位：

    # 定位首个事故行的日期单元格（假设日期为第二列）
    first_row_date = wait.until(EC.presence_of_element_located((By.CSS_SELECTOR, 'vaadin-grid-row:first-child vaadin-grid-cell-content:nth-child(2)')))
    # 或通过aria-label等语义属性定位
    date_element = wait.until(EC.presence_of_element_located((By.CSS_SELECTOR, 'vaadin-grid-cell-content[aria-label*="Date"]')))
    

• BeautifulSoup无法处理动态内容：BeautifulSoup仅能解析静态HTML，Vaadin组件的内容由JS动态生成，直接提取driver.page_source可能未包含目标文本。
  • 解决：优先用Selenium直接获取元素文本，确认元素加载完成后再考虑用BeautifulSoup解析页面。

内容的提问来源于stack exchange，提问作者Kris C