Django项目中Selenium点击cardboard.market排序按钮失效求助

开发基于Django的球星卡网站，目标是通过Selenium结合ChromeDriver获取指定球星卡的最低价（以1990 Pro Set系列David Seaman球星卡为例）。流程为访问目标站点、搜索卡片、按最低价排序后提取首张卡片价格。

补充说明：不执行排序操作时，能正常提取结果中首张卡片的价格，但点击“按最低价排序”按钮后无法成功提取价格。

1. 动态类名导致定位失效：当前用cmgaaC这类动态生成的类名定位排序按钮，这类类名由前端框架自动生成，页面更新或刷新后会变化，直接导致按钮定位失败。
2. 未等待排序后页面更新：点击排序按钮后，页面会重新加载或更新列表数据，但代码直接开始查找价格元素，此时排序后的结果还未渲染完成，自然找不到目标元素。
3. 层级定位冗余脆弱：通过多层级find_element遍历定位价格元素，只要中间某一层级的页面结构发生变化，整个定位链就会断裂，容错性极低。

1. 优化排序按钮定位 #

改用稳定的定位策略，比如结合按钮文本或语义化属性，避免依赖动态类名：

• 用XPATH定位包含“Price: Low to High”文本的按钮
• 或通过按钮的aria-label等语义化属性定位

2. 增加排序后等待逻辑 #

点击排序按钮后，显式等待列表元素更新完成，比如等待首个价格元素重新可见，确保页面渲染完成后再提取数据。

3. 简化价格元素定位 #

直接定位价格元素的特征标签，无需多层级遍历，提升定位的稳定性。

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.chrome.service import Service as ChromeService
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC

def get_lowest_card_price(card_name):
    base_url = "https://cardboard.market/"
    search_url = f"{base_url}search?q={card_name}"

    try:
        # 初始化ChromeDriver
        driver_path = "C:/Webdrivers/chromedriver.exe"
        service = ChromeService(driver_path)
        driver = webdriver.Chrome(service=service)
        driver.get(search_url)

        # 等待排序按钮加载并点击（通过文本定位，避免动态类名）
        sort_button = WebDriverWait(driver, 10).until(
            EC.element_to_be_clickable((By.XPATH, "//button[contains(text(), 'Price: Low to High')]"))
        )
        sort_button.click()

        # 等待排序后的价格元素加载完成
        target_price = WebDriverWait(driver, 10).until(
            EC.visibility_of_element_located((By.XPATH, "//div[contains(@class, 'bubble-element.Text') and contains(@class, 'cmgaCs')]"))
        )

        # 提取价格文本
        if target_price:
            return target_price.text.strip()
        else:
            print(f"未找到卡片'{card_name}'的价格元素")
    except Exception as e:
        print(f"错误: {e}")
    finally:
        if driver:
            driver.quit()

    return None

# Django视图函数
def ProSet1990_1(request):
    card_name = "David Seaman"
    card_set = "1990 Pro Set"

    lowest_price = get_lowest_card_price(f'{card_set} {card_name}')

    context = {
        'card_name': card_name,
        'lowest_price': lowest_price,
    }

    return render(request, 'Application/ProSet1990_1.html', context)

额外优化建议 #

• 所有元素操作前都使用WebDriverWait显式等待，避免因网络延迟或页面渲染慢导致的错误。
• 优先使用XPATH结合文本、id、aria-label等语义化属性定位元素，拒绝依赖动态生成的类名。
• 增加异常场景处理，比如搜索无结果、排序按钮不存在等情况，输出更明确的错误提示。

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