如何判断元素是否在iframe中？Reddit上传按钮定位失败求助

在Reddit的r/Watchexchange社区图片提交页面，我无法定位红框标注的上传按钮，推测该元素可能在iframe内。

目标元素HTML代码 #

<button rpl="" class="upload-media action
button-small px-[var(--rem6)]
button-secondary


icon
items-center justify-center
button inline-flex " id="device-upload-button" type="button"> <!--?lit$869276182$--><!----><span class="flex items-center justify-center"> <!--?lit$869276182$--><span class="flex"><!--?lit$869276182$--><svg rpl="" fill="currentColor" height="16" icon-name="upload-outline" viewBox="0 0 20 20" width="16" xmlns="http://www.w3.org/2000/svg"> <!--?lit$869276182$--><!--?lit$869276182$--><path d="m10.513 5.63 3.929 3.928-.884.884-2.933-2.933V19h-1.25V7.51l-2.933 2.932-.884-.884L9.67 5.446l.589-.029.254.212Zm5.859-1.482A6.876 6.876 0 0 0 10 0a6.876 6.876 0 0 0-6.372 4.148A4.639 4.639 0 0 0 0 8.625a4.716 4.716 0 0 0 4.792 4.625V12A3.465 3.465 0 0 1 1.25 8.625 3.412 3.412 0 0 1 4.189 5.31l.364-.06.123-.35A5.607 5.607 0 0 1 10 1.25a5.607 5.607 0 0 1 5.324 3.65l.123.348.364.06a3.412 3.412 0 0 1 2.939 3.317A3.465 3.465 0 0 1 15.208 12v1.25A4.716 4.716 0 0 0 20 8.625a4.639 4.639 0 0 0-3.628-4.477Z"></path><!--?--> </svg></span> <!--?lit$869276182$--> </span> <!--?lit$869276182$--><!--?--><!----><!----><faceplate-screen-reader-content><!--?lit$869276182$-->Upload files</faceplate-screen-reader-content><!----> </button>

已尝试的Selenium代码 #

driver = webdriver.Firefox()
driver.get("https://www.reddit.com/r/Watchexchange/submit/?type=IMAGE")
wait = WebDriverWait(driver, 10)

wait.until(EC.presence_of_element_located((By.ID, 'device-upload-button')))
wait.until(EC.presence_of_element_located((By.XPATH, '//*[@id="device-upload-button"]')))
wait.until(EC.presence_of_element_located((By.XPATH,'//button[contains(@class,"flex items-center justify-center")]')))

疑问 #

如何判断元素是否在iframe中？以及如何正确定位该上传按钮？

一、判断元素是否在iframe中的方法 #

1. 浏览器开发者工具检查：

   • 右键点击上传按钮选择“检查”，在Elements面板查看元素层级。如果按钮的父级/祖先级存在<iframe>标签，说明元素在iframe内。
   • 也可在控制台执行document.getElementById('device-upload-button')，若返回null但手动能在面板找到元素，大概率处于iframe中。

2. Selenium验证：

   • 直接定位元素若抛出NoSuchElementException，遍历页面所有iframe并切换上下文，切换后能找到元素则说明它在对应iframe内。

二、正确定位元素的步骤 #

1. 切换到目标iframe：
   Reddit上传组件通常在内嵌iframe中，先定位并切换上下文：

   # 等待iframe加载完成并切换
   iframe = wait.until(EC.presence_of_element_located((By.TAG_NAME, 'iframe')))
   driver.switch_to.frame(iframe)
   

   若页面有多个iframe，可通过src属性精准定位：

   iframe = wait.until(EC.presence_of_element_located((By.XPATH, '//iframe[contains(@src, "upload")]')))
   driver.switch_to.frame(iframe)
   

2. 定位并操作上传按钮：
   切换iframe后，使用ID定位并等待按钮可点击：

   upload_button = wait.until(EC.element_to_be_clickable((By.ID, 'device-upload-button')))
   upload_button.click()
   

3. 切换回主文档（可选）：
   操作完iframe内元素后，如需操作主页面元素，切换回主上下文：

   driver.switch_to.default_content()
   

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