此示例中的 HTML 中 svg 的正确 xpath 是什么？答案

【问题标题】：What is the correct xpath for the svg in the HTML featured in this example?此示例中的 HTML 中 svg 的正确 xpath 是什么？
【发布时间】：2021-02-02 18:22:15
【问题描述】：

到目前为止，我有以下代码：

like_button =  driver.find_element_by_xpath('//div[@class="QBdPU "]/*[name()="svg"][@aria-label="Like"]')
like_button().click()

与以下 HTML 相对应（我正在尝试单击 svg 部分）：

想知道是否有人可以纠正我的 xpath。

【问题讨论】：

你可能真的想定位
svg 节点不是div 的child，而是descendant，所以要么将.../*[name()="svg"] 替换为...//*[name()="svg"]，要么在它们之间添加.../span/...，如Jack Fleeting answer

标签： python selenium xpath css-selectors webdriver

【解决方案1】：

尝试将您的 xpath 表达式更改为

//div[@class="QBdPU "]/span/*[name()="svg" and @aria-label="Like"]

看看它是否有效。

【讨论】：

小心，svg 元素位于浏览器 DOM 的隐含命名空间中。

【解决方案2】：

正如评论中提到的kjhughes，svg 元素位于 HTML 的不同命名空间中，因此我们在通过 xpath 选择时需要小心。

我看到您正在尝试在 Instagram 上获得“Like”按钮，我已经在 Chrome 上对此进行了测试，我认为它也可以在 Selenium 上运行。试试：

//*[name()="svg" and @aria-label="Like" and @height="24"]

如果您还想在 cmets 上获得 Like 按钮，请删除 and @height="24"。评论上的“赞”按钮具有and @height="12" 属性。

【讨论】：

【解决方案3】：

要在 Instagram 上的 Like 按钮上识别和click()，您可以使用以下任一Locator Strategies：

使用XPATH：

WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.CSS_SELECTOR, "//button[@type='button']//span//*[name()="svg" and @aria-label='Like']"))).click()

使用CSS_SELECTOR：

WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.CSS_SELECTOR, "button[type='button'] span > svg[aria-label="Like"]"))).click()

注意：您必须添加以下导入：

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

【讨论】：