Selenium自动化脚本无法点击圆形座位元素：存在遮挡问题

以下是针对你遇到的问题的几种排查和解决思路：

1. 确认座位元素是否在SVG内部 #

从截图看座位是圆形元素，大概率属于SVG组件。Selenium对SVG元素的选择器支持有差异，原CSS选择器可能无法正确定位到SVG内的circle元素：

• 修改CSS选择器为："svg circle.seat:not(.booked):not(.selected)"
• 或者改用XPATH定位："//svg//circle[contains(@class, 'seat') and not(contains(@class, 'booked')) and not(contains(@class, 'selected'))]"

2. 优化元素等待逻辑 #

虽然你用了element_to_be_clickable，但有时候页面渲染未完全完成，元素虽然存在但点击区域未就绪：

• 先等待页面完全加载完成：

  WebDriverWait(driver, 10).until(lambda d: d.execute_script('return document.readyState') == 'complete')
  

• 将等待条件改为presence_of_element_located结合后续的JS点击，避免element_to_be_clickable误判元素状态。

3. 修复JavaScript点击的写法 #

如果之前用JS点击没生效，试试以下两种写法：

• 直接触发元素的click方法：

  driver.execute_script("arguments[0].click();", seat)
  

• 模拟原生鼠标点击事件（针对SVG元素更有效）：

  driver.execute_script("""
      const event = new MouseEvent('click', {
          bubbles: true,
          cancelable: true,
          view: window
      });
      arguments[0].dispatchEvent(event);
  """, seat)
  

4. 检查页面是否有遮挡元素 #

ElementClickInterceptedException的核心原因是元素被其他UI遮挡，比如：

• 隐藏的加载遮罩层、弹窗背景
• 页面顶部的固定导航栏
• 座位元素的父级容器有透明覆盖层

可以通过浏览器开发者工具的「选择元素」功能，点击座位区域，查看是否有其他元素覆盖在上方。如果有，先等待遮罩层消失：

WebDriverWait(driver, 10).until(EC.invisibility_of_element_located((By.CSS_SELECTOR, "这里替换为遮罩层的选择器")))

5. 调整ActionChains的点击方式 #

如果用ActionChains没生效，试试精准定位到元素中心再点击：

from selenium.webdriver.common.action_chains import ActionChains

actions = ActionChains(driver)
# 移动到元素中心再点击
actions.move_to_element(seat).click().perform()
# 如果元素过小，可添加偏移量（比如x和y方向各偏移5像素）
# actions.move_to_element_with_offset(seat, 5, 5).click().perform()

6. 避免重复选择同一座位 #

当前循环中每次都获取第一个可点击座位，点击后该座位可能已标记为选中，但选择器没排除已选中状态，导致重复点击同一元素。修改选择器排除已选中的座位：

circle.seat:not(.booked):not(.selected)

修改后的完整示例代码 #

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

num_seats = 2

# 等待页面完全加载
WebDriverWait(driver, 10).until(lambda d: d.execute_script('return document.readyState') == 'complete')

for i in range(num_seats):
    # 定位未预订、未选中的SVG座位元素
    seat = WebDriverWait(driver, 100).until(
        EC.presence_of_element_located((By.CSS_SELECTOR, "svg circle.seat:not(.booked):not(.selected)"))
    )
    seat_id = seat.get_attribute("id")
    print("Ghế trống - ID:", seat_id)
    
    # 使用JavaScript执行点击
    driver.execute_script("arguments[0].click();", seat)
    print("Đã Click")

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