获取：元素在使用 Selenium 时不可交互

Question

我正在尝试使用 Selenium 单击“加载更多”按钮。虽然我收到 Message: element not interactable 错误。当我保存由 Selenium 加载的 HTML 响应并以 HTML 打开时，我看到按钮在那里并且可以点击（见下图）。这里还有一个来自这个保存页面的按钮标签：

<kcl-load-more main-class="mb-25" on-click="addMorePosts()" model="latestPosts" model-loading="postsLoading" class="ng-isolate-scope">
<div class="kcl-load-more mb-25" ng-class="vm.mainClass">\n\n
    <!-- ngIf: vm.model.length && !vm.hideIf -->
    <button class="kcl-btn ng-scope" ng-class="vm.buttonClass" ng-click="vm.click()" ng-disabled="vm.loading || vm.modelLoading" ng-if="vm.model.length &amp;&amp; !vm.hideIf" style="">\n <span class="hidden-side-scroll">LOAD MORE</span>\n
        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 35.09 34.39" height="32" width="32" aria-labelledby="title" class="icon visible-side-scroll">\n
            <title>Load More</title>\n
            <path fill="#3B3B3B" d="M35.09,17.19s0-.09,0-.13h0a1.31,1.31,0,0,0-.38-.78l0,0L18.82.38A1.31,1.31,0,0,0,17,2.23L30.62,15.88H1.31a1.31,1.31,0,0,0,0,2.62H30.62L17,32.15A1.31,1.31,0,1,0,18.82,34L34.67,18.15l0,0a1.31,1.31,0,0,0,.38-.79h0s0-.09,0-.14Z"></path>\n </svg>\n </button>
    <!-- end ngIf: vm.model.length && !vm.hideIf -->\n
    <!-- ngIf: vm.model.length && !vm.hideIf -->
    <div class="visible-side-scroll text-center ng-scope" ng-if="vm.model.length &amp;&amp; !vm.hideIf" ng-click="vm.click()" style="">LOAD MORE</div>
    <!-- end ngIf: vm.model.length && !vm.hideIf -->\n</div>\n</kcl-load-more>

这是我使用的代码：

from selenium import webdriver      
from selenium.common.exceptions import NoSuchElementException
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
import time
from selenium.webdriver.chrome.options import Options

URL = "https://thekrazycouponlady.com/coupons-for/costco"
LOAD_MORE_BUTTON_XPATH = '//button[@class = "kcl-btn ng-scope"]' 
# ADD_XPATH = '//button[@class = "btn btn-dismiss holiday-dismiss"]'
options = Options()
options.headless = True
driver = webdriver.Chrome(r'C:\Python3\selenium\webdriver\chromedriver_win32\chromedriver.exe', chrome_options=options)
driver.get(URL)

while True:
    try:
        time.sleep(35)
        html = driver.page_source.encode('utf-8')
        print(html)

        loadMoreButton = driver.find_element_by_xpath(LOAD_MORE_BUTTON_XPATH)
        loadMoreButton.click()

    except Exception as e:
        print (e)
        break
print ("Complete")

driver.quit()

如何点击按钮？

P.S。完整异常日志：

Traceback (most recent call last):
  File "C:\Code\Active\driverv1.py", line 10, in <module>
    wd.find_element_by_css_selector("button[ng-class='vm.buttonClass']").click()
  File "C:\Python3\lib\site-packages\selenium\webdriver\remote\webelement.py", line 80, in click
    self._execute(Command.CLICK_ELEMENT)
  File "C:\Python3\lib\site-packages\selenium\webdriver\remote\webelement.py", line 633, in _execute
    return self._parent.execute(command, params)
  File "C:\Python3\lib\site-packages\selenium\webdriver\remote\webdriver.py", line 321, in execute
    self.error_handler.check_response(response)
  File "C:\Python3\lib\site-packages\selenium\webdriver\remote\errorhandler.py", line 242, in check_response
    raise exception_class(message, screen, stacktrace)
selenium.common.exceptions.WebDriverException: Message: unknown error: Element <button class="kcl-btn ng-scope" ng-class="vm.buttonClass" ng-click="vm.click()" ng-disabled="vm.loading || vm.modelLoading" ng-if="vm.model.length &amp;&amp; !vm.hideIf" style="">...</button> is not clickable at point (511, 686). Other element would receive the click: <iframe id="google_ads_iframe_/4916285/sdb_tabbot_728x90.01_0" title="3rd party ad content" name="google_ads_iframe_/4916285/sdb_tabbot_728x90.01_0" width="728" height="90" scrolling="no" marginwidth="0" marginheight="0" frameborder="0" srcdoc="" style="border: 0px; vertical-align: bottom;" data-google-container-id="1" data-load-complete="true"></iframe>
  (Session info: chrome=70.0.3538.110)
  (Driver info: chromedriver=2.44.609538 (b655c5a60b0b544917107a59d4153d4bf78e1b90),platform=Windows NT 6.1.7601 SP1 x86)

Answer 1

页面太重，加载时间太长。我已尝试为您的问题编写最佳代码。

from selenium import webdriver
URL = "https://thekrazycouponlady.com/coupons-for/costco"
chrome_path = r"chromedriver.exe"
wd = webdriver.Chrome(chrome_path)
wd.get(URL)

等到弹出窗口出现并关闭它。您也可以先尝试抓取内容，同时如果出现弹出关闭它，但会变得有点复杂。

while(True):
    try:
        wd.find_element_by_css_selector("button[class='btn btn-dismiss holiday-dismiss']").click()
        break
    except:
        continue

循环执行这三行，加载"LOAD MORE"内容，每次执行最多延迟2s。

element = wd.find_element_by_css_selector("div[class='newsletter-sign-up-widget']")
element.location_once_scrolled_into_view
wd.find_element_by_css_selector("button[ng-class='vm.buttonClass']").click()

P.S ：我也在 google-colab 上使用无头 chrome 进行了尝试。如果您需要云上无头笔记本的笔记本，请在下方评论。

获取：元素在使用 Selenium 时不可交互

Getting : element not interactable when using Selenium

selenium

selenium-webdriver

browser-automation