学习WEB自动化第三天-CSDN博客

本文链接：https://blog.csdn.net/Betray391/article/details/141902159

一、iframe框的跳转

有时候我们在一个页面发现有iframe元素，这个时候我们就不能在原来的页面上操作了，这时候我们就需要一个跳转来操控页面

1. 定位并切换到 iframe

通过ID或NAME属性: 直接使用iframe的ID或NAME属性来切换。

driver.switch_to.frame("iframe_id_or_name")

通过元素定位: 使用Selenium的元素定位方法（如By.XPATH）定位并切换。

iframe_element = driver.find_element(By.XPATH, '//*[@id="iframe_id"]')
driver.switch_to.frame(iframe_element)

通过索引: 页面有多个iframe时，可以使用索引进行切换。

driver.switch_to.frame(0)  # 切换到第一个iframe

2. 在 iframe 中执行操作

切换到iframe后，像平时操作页面一样操作里面的元素

driver.find_element(By.XPATH, '//*[@id="element_inside_iframe"]').click()

3. 切换回主页面

完成iframe内操作后，使用以下方法切换回主页面，以继续其他操作

driver.switch_to.default_content()

好的，按照这个步骤操作就可以了，接下来我们把他们拼接到一起来看看效果

#这里导包
from selenium import webdriver
from selenium.webdriver.common.by import By
import time

driver = webdriver.Chrome()
driver.get("https://sahitest.com/demo/iframesTest.htm")
time.sleep(2)

# 切换到iframe
iframe_element = driver.find_element(By.XPATH, '//*[@name="testframe"]')
driver.switch_to.frame(iframe_element)

# 在iframe中操作
driver.find_element(By.XPATH, '/html/body/table/tbody/tr/td[1]/a[1]').click()

# 切换回主页面
driver.switch_to.default_content()

driver.quit()

这样我们就能在ifram页面和主页面之前来回操作了

二、JS操作

JS操作我们这里是指通过Selenium执行JavaScript代码来操控网页元素、修改页面内容或触发某些事件，这种方法在一些传统的定位方法失效或者需要与动态内容交互时非常有用，让我们来看看如何操作

1.滚动操作

有时候我们想要这个页面往下滚动，这个时候就可以通过JS操作来实现

script = "window.scrollTo(0, document.body.scrollHeight);"
driver.execute_script(script)

接下来让我们解释一下这段代码都是什么意思：

script = "window.scrollTo(0, document.body.scrollHeight);"

这是一个JavaScript代码字符串，作用是将页面滚动到页面的底部

window.scrollTo(0, document.body.scrollHeight);

window.scrollTo(x, y)方法用于滚动窗口到指定的坐标位置
x表示水平滚动的像素量，这里为0，表示不在水平方向上滚动
y表示垂直滚动的像素量，这里为document.body.scrollHeight，表示滚动到页面内容的高度，也就是页面的最底部
driver.execute_script(script) 使用Selenium的execute_script()方法在当前页面上执行该JavaScript代码

其实关于滚动操作还有很多种，平时用这一种也够了，就不再细说了

2.时间控件处理

有的时候我们发现一些填信息的框旁边有一个日历选择器，我们需要点击它来选择我们的时间，这个时候一般的定位是无法定位对其进行更改的，这个时候就需要我们通过JS来采取一些特殊的方法来实现让代码自动帮我们选择日期

我这边就直接给一段代码，然后我们来解释一下：

from selenium import webdriver
from selenium.webdriver.common.by import By
import datetime

driver = webdriver.Chrome()
driver.get("your_website_url")

# 将时间控件的属性改为 text，使其可以直接输入文本
script = "document.getElementById('inputdate').setAttribute('type','text')"
driver.execute_script(script)

# 生成当前日期
dt = datetime.datetime.now().strftime("%Y-%m-%d")

# 发送日期到控件
driver.find_element(By.ID, "inputdate").send_keys(dt)

好的让我们来仔细分析一下我们是入个输入日期的：

script = "document.getElementById('inputdate').setAttribute('type','text')":

这段代码用于将页面中 ID 为 inputdate 的元素的类型属性（type）改为 text，使得这个控件可以直接输入文本（日期）。
driver.execute_script(script):

使用 Selenium 执行上述 JavaScript 脚本

到这里，原理已经很明白了，实际上就是转换一下元素类型，让它变得可以输入，这样我们就能输入我们想要的日期了

3.上传处理

我们在控制页面的时候，可能会需要上传一些东西，但是我们的代码都是控制浏览器的，无法控制本地的系统，那么如何能够实现上传图片的自动化呢（不只是图片，只要是可以上传的都是），我们接下来就来看看如何实现

首先我们要定位上传文件的输入框元素

上传文件的输入框通常是一个 <input> 元素，type 属性为 "file"。你需要找到这个元素，并将文件路径发送给它

通过 .send_keys() 方法，将文件的路径发送到定位的文件输入框中，这样就会自动触发文件上传

这是一个例子

from selenium import webdriver
from selenium.webdriver.common.by import By

# 初始化 WebDriver
driver = webdriver.Chrome()

# 打开目标网站
driver.get("https://example.com/upload")

# 定位文件上传输入框元素
upload_element = driver.find_element(By.ID, "file-upload")

# 发送文件路径到输入框
file_path = "C:/path/to/your/file.txt"
upload_element.send_keys(file_path)

# 提交表单或点击上传按钮
driver.find_element(By.ID, "submit-button").click()

让我来解释一下这中间的东西

定位上传输入框：

driver.find_element(By.ID, "file-upload") 通过元素的 ID 定位文件上传的输入框。
注意：如果页面没有 ID 可以使用，可以通过其他定位方式（如 name、class name、xpath 等）来定位输入框元素。
发送文件路径：

upload_element.send_keys(file_path) 将文件的绝对路径发送到输入框中，相当于用户在输入框中选择文件的操作。
提交上传：

发送文件路径后需要点击上传按钮或提交表单来完成文件上传
driver.find_element(By.ID, "submit-button").click() 用于模拟点击上传按钮。
这里要注意一下
文件路径格式：文件路径需要是绝对路径，而且要确保路径中的反斜杠（\）使用双反斜杠（\\）或者使用正斜杠（/）。

文件类型限制：某些网页可能对上传的文件类型有限制，确保上传的文件类型与网页要求一致。

等待文件上传完成：有时上传较大的文件可能需要一些时间，可以使用 WebDriverWait 来等待上传过程完成，或者直接 time.sleep() 来进行延时等待

4.下载处理

既然有上传，那就有下载，相较于上传，下载明显就简单多了
上传图片需要pip install 安装pyautogui

下载方法：

我们在这里面输入pip install pyautogui 等待他安装完成就行了

这里直接上代码

options = webdriver.ChromeOptions()
pf = {"download.default_directory": r"E:\GMM"}
options.add_experimental_option("prefs", pf)
# 打开 Chrome 浏览器并进入目标网站
driver = webdriver.Chrome()
driver.get("https://www.todesk.com/download.html")
driver.maximize_window()  # 最大化窗口
time.sleep(2)

好的现在来解释一下：

options = webdriver.ChromeOptions()

创建一个 ChromeOptions 对象，用于配置 Chrome 浏览器的启动参数

pf = {"download.default_directory": r"E:\GMM"}:

设置浏览器下载文件的默认目录为 E:\GMM

download.default_directory 指定了文件下载的路径
将设置应用到浏览器:

options.add_experimental_option("prefs", pf):

将上述下载路径的配置应用到 Chrome 浏览器实例中

我们需要告诉浏览器下载到哪个位置，然后正常操作点击这个元素就能够完成下载