如何悬停然后单击硒中的按钮？

Question

我在网页中有 html 代码的以下部分

<div class="action">
   <div class="double-button">
      <button class="widget-button" title="2 people liked this post">2</button>
      <button class="widget-button like" title="like this post">
         <svg class="fa d-icon d-icon-d-unliked svg-icon svg-node" aria-hidden="true">
            <use xlink:href="#far-heart"></use>
         </svg>
      </button>
   </div>
</div>

将鼠标悬停在第一个按钮上后，class 名称更改并且代码转换为

<div class="action">
   <div class="double-button">
      <button class="widget-button d-hover" title="2 people liked this post">2</button>
      <button class="widget-button like" title="like this post">
         <svg class="fa d-icon d-icon-d-unliked svg-icon svg-node" aria-hidden="true">
            <use xlink:href="#far-heart"></use>
         </svg>
      </button>
   </div>
</div>

点击第一个按钮后，会出现一个新的 div，其中包含喜欢 post

的人

<div class="action">
   <div class="double-button">
      <button class="widget-button d-hover" title="2 people liked this post">2</button>
      <button class="widget-button like" title="like this post">
         <svg class="fa d-icon d-icon-d-unliked svg-icon svg-node" aria-hidden="true">
            <use xlink:href="#far-heart"></use>
         </svg>
      </button>
   </div>
   <div class="likes">
      <a class="trigger-user" href="/USER1" name="USER1">USER1</a>
      <a class="trigger-user" href="/USER2" name="USER2">USER2</a>
   </div>
</div>

我的 objective 是 select 所有使用 selenium 和 python3 的用户所以我尝试了以下代码，灵感来自其他堆栈溢出问题，如 link1 and link2

driver = webdriver.Chrome(executable_path='./chromedriver_83') #this works fine
driver.get("link_to_the_page") #also I get the link and all contents without problems
likes_button=driver.find_elements_by_xpath("//button[@class='widget-button']") # works fine too
print(likes_button[0].text) # This gives '2', it the right value 
hover = ActionChains(driver).move_to_element(likes_button[0]) #select only the first element in the page for testing
hover.perform() # I think the hover does not work even if this is the right way 
likes_button_hover=driver.find_elements_by_xpath("//button[@class='widget-button d-hover']") # now select the hovered button to be clicked, since I hovered only one button in the whole page the result shoud be one
print(len(likes_button_hover)) # this gives 0 while it should give 1 
likes_button_hover[0].click() # this throw an error

我收到以下错误，这意味着按钮没有更改 class（悬停不起作用）

    raise exception_class(message, screen, stacktrace)
    selenium.common.exceptions.ElementClickInterceptedException: Message: element click intercepted: Element <button class="widget-button" title="2 people liked this post">2</button> is not clickable at point (537, 17). Other element would receive the click: <span>...</span>
      (Session info: chrome=83.0.4103.116)

我尝试以多种方式进入第一个按钮，例如使用 driver.find_elements_by_css_selector("[title*='people liked this post']") 但徒劳无功，我认为问题出现在悬停中但我不明白为什么，当然我无法获得按钮并在没有先悬停它的情况下单击它。我做错了什么？

Answer 1

我可以在这里看到两个解决方案。

1: 作为按钮（您需要单击以查看所有用户的按钮）始终存在，但只有 class 在变化。所以你可以直接点击而不用悬停在上面。

likes_button=driver.find_elements_by_xpath("//button[contains(@title,'people liked this post')]") # Used contains as number of people liked might change
print(likes_button[0].text) # This gives '2', it the right value 
likes_button[0].click() # If not working try javaScript : driver.execute_script("arguments[0].click();", likes_button[0])

2: 如果你真的只想在悬停后点击，我想你可能需要 pause Actionchain 的方法 class.由于 java 脚本可能需要一些时间来加载。在您的情况下，它试图在悬停鼠标后立即使用 class widget-button d-hover 查找按钮。

   likes_button=driver.find_elements_by_xpath("//button[@class='widget-button']") 
   print(likes_button[0].text) 
   ActionChains(driver).move_to_element(likes_button[0]).pause(1).perform() 
    likes_button_hover=driver.find_elements_by_xpath("//button[@class='widget-button d-hover']")
   print(len(likes_button_hover))
   likes_button_hover[0].click()

如何悬停然后单击硒中的按钮？

How to hover then click a button in selenium?

web-crawler

hover

python-3.x

selenium-chromedriver

selenium-webdriver