javascript - 如何使用 selenium 驱动程序单击元素？

Question

我一直在尝试使用 selenium 抓取 bookmyshow 网站的网页。页面加载后，会出现 2 个弹出窗口。在这两个中，我们必须单击所需的按钮来关闭它们。当我尝试找到这些元素时，出现错误。我让驱动程序使用 sleep() 完全加载页面。但我仍然无法做到这一点。

代码是:

from bs4 import BeautifulSoup
import requests
from selenium import webdriver
from time import sleep
s = requests.session()
driver = webdriver.Chrome('F:\chromedriver')
driver.get("https://in.bookmyshow.com/booktickets/VMAX/2061")
sleep(40)
e2 = driver.find_element_by_class_name('wzrkPPwarp')
e2.click()
print("done")
e1 = driver.find_element_by_class_name('No thanks')
e1.click()

element = driver.find_element_by_class_name('__buytickets')
element.click()
element1 = driver.find_element_by_class_name('rem-seats')
print(element1.text)

我得到的输出是:

NoSuchElementException: Message: no such element: Unable to locate element: {"method":"class name","selector":"wzrkPPwarp"}
  (Session info: chrome=64.0.3282.140)
  (Driver info: chromedriver=2.33.506120 (e3e53437346286c0bc2d2dc9aa4915ba81d9023f),platform=Windows NT 10.0.16299 x86_64)

html内容是:(可能由javascript加载)

<div id="wzrk_wrapper"><style>.wzrk-overlay{background-color:rgba(0,0,0,.15);position:fixed;left:0;right:0;top:0;bottom:0;z-index:10000}.wzrk-hidden{display:none}.wzrk-alert{background-color:#fbfbfb;border:1px solid #f0f0f0;font-family: Arial,sans-serif;width:346px;padding:15px 15px 5px;border-radius:6px;text-align:center;position:fixed;right:20px;top:20px;margin-left:0;margin-top:0;overflow:hidden;z-index:99999}@media screen and (max-width:540px){.wzrk-alert{width:auto;margin:auto 0;top:35%;left:15px;right:15px}}.wzrk-alert-heading{color:#606060;font-size:20px;width:250px;animation:none;text-align:center;font-weight:700;margin:0 auto 10px;display:block}.wzrk-alert-body{color:#939393;font-size:14px;font-weight:300;animation:none;margin-bottom:10px}.wzrk-button-container button{background-color:#dbdbdb;color:#fff;border:none!important;box-shadow:none!important;min-width:130px;font-size:14px;animation:none;font-weight:100;border-radius:3px;padding:8px 10px;margin:0 7px;cursor:pointer}.wzrk-alert button:focus{outline:0}.wzrk-alert button:active{background:#5dc241}.wzrk-alert button.confirm{background-color:#f28046}.wzrk-button-container button.cancel{background-color:#dbdbdb;color:#7c7c7c}.wzrk-button-container button.cancel:hover{background-color:#d7d7d7}.wzrk-powered{font-family: Arial,sans-serif;font-size:9px;color:#777;animation:none;margin-top:12px;margin-right:2px;text-align:right}.wzrk-powered img{display:inline-block;animation:none;margin-bottom:-2px;-webkit-filter:contrast(10%);filter:grayscale(150%)}@-webkit-keyframes showWizAlert{0%{transform:scale(.7);-webkit-transform:scale(.7)}45%{transform:scale(1.05);-webkit-transform:scale(1.05)}80%{transform:scale(.95);-webkit-transform:scale(.95)}100%{transform:scale(1);-webkit-transform:scale(1)}}@-webkit-keyframes hideWizAlert{0%{transform:scale(1);-webkit-transform:scale(1)}100%{transform:scale(.5);-webkit-transform:scale(.5)}}.wiz-show-animate{animation:showWizAlert .3s}.wiz-hide-animate{animation:hideWizAlert .2s}</style><div class="wzrk-overlay"></div><div class="wzrk-alert wiz-show-animate"><div class="wzrk-alert-heading">Get Personalized Updates</div><div class="wzrk-alert-body">Get notified when we find something interesting that you'll love!</div><div class="wzrk-button-container"><button id="wzrk-cancel" class="No thanks">Not Now</button><button id="wzrk-confirm" class="Sign me Up!" style="background-color: rgb(192, 44, 58);">OK</button></div><div class="wzrk-powered"><a href="https://clevertap.com" target="_blank">Powered by <img src="https://d2r1yp2w7bby2u.cloudfront.net/js/ct_logo.svg" height="9" style="height:9px;"></a></div></div></div>

<div class="wzrkPPwarp" style="color:#eaeaea;background-color:#2f323b;"><a href="javascript:void(0);" onclick="parent.$WZRK_WR.closeIframe('1517903135','wizParDiv');" class="wzrkClose" style="background-color:#353535;color:#ffffff;">×</a><div id="contentDiv" style="width:100%;" class="wzrk"><div class="jsCT_CTA"><table cellpadding="0" cellspacing="0" border="0"><tbody><tr><td class="imgTd" style="background-color:#2f323b"><img src="https://in.bmscdn.com/mailers/images/160701promotion/kabali_footer_bms_logo.jpg" height="60" width="60"></td><td style="vertical-align:middle;"><div class="wzrkPPtitle" style="color:#eaeaea">Save INR 300* on movie tickets!</div><div class="wzrkPPdscr" style="color:#eaeaea">Book for your favorite one using your MobiKwik wallet &amp; get 50%* Supercash on your transaction amount!</div></td></tr></tbody></table></div></div></div>

如何做到这一点？如何点击这两个元素？

Answer 1

在对 iframe 内的任何元素执行任何操作之前，我们必须像这样切换到相应的frame。

# To switch to frame
driver.switch_to.frame(driver.find_element_by_id("wiz-iframe"))

# Clicking on the element inside the frame
e2 = driver.find_element_by_xpath("//div[@class='wzrkPPwarp']//a")
e2.click()

一旦对 iframe 中的元素执行了所需的操作，我们就将控件带回到默认内容，以便在主窗口上执行这样的操作。

# Switching back to main content
driver.switch_to_default_content()

# Then only we can access elements
e3 = driver.find_element_by_xpath("//button[@class='No thanks']")
e3.click()