devbox
从前慢现在也慢
这个屌丝很懒，什么也没留下！
关注作者
热门标签
热门文章
当前位置:   article > 正文

WEB自动化测试第一讲—selenium中阶操作

作者：从前慢现在也慢 | 2024-07-28 06:07:29

赞

踩

WEB自动化测试第一讲—selenium中阶操作

一、实现键盘输入

selenium可以实现使用键盘输入，需要用到Keys方法实现，比如回车，复制，粘贴等等，一下将讲述一下用的最多的

一、回车

具体操作需要导入包，路径为selenium.webdriver.common.keys import Keys,但是如何让其使用，也是需要用到send_keys输入，以百度为例，回车键进行搜索。

  1. import time
  2.  
  3. from selenium import webdriver
  4. from selenium.webdriver.common.by import By
  5. from selenium.webdriver.common.keys import Keys
  6. # 实例化浏览器
  7. driver = webdriver.Chrome()
  8. # 窗口最大化
  9. driver.maximize_window()
  10. # 打开百度网页
  11. driver.get("https://www.baidu.com")
  12. # 设置等待时间
  13. time.sleep(5)
  14. # 输入框输入信息
  15. driver.find_element(By.ID,'kw').send_keys("回车")
  16. # 设置等待时间
  17. time.sleep(5)
  18. # 使用回车进行搜索
  19. driver.find_element(By.ID, 'kw').send_keys(Keys.ENTER)
  20. # 设置等待时间
  21. time.sleep(5)
  22. # 关闭浏览器
  23. driver.quit()

二、全选

复制使用Keys.CONTROL，后面加a，进行复制，完全模拟快捷键ctrl+a，界面中会显示代码如下：

  1. import time
  2.  
  3. from selenium import webdriver
  4. from selenium.webdriver.common.by import By
  5. from selenium.webdriver.common.keys import Keys
  6.  
  7. # 实例化浏览器
  8. driver = webdriver.Chrome()
  9. # 窗口最大化
  10. driver.maximize_window()
  11. # 打开百度网页
  12. driver.get("https://www.baidu.com")
  13. # 设置等待时间
  14. time.sleep(5)
  15. # 输入框输入信息
  16. driver.find_element(By.ID,'kw').send_keys("全选")
  17. # 全选
  18. driver.find_element(By.ID, 'kw').send_keys(Keys.CONTROL,'a')
  19. # 设置等待时间
  20. time.sleep(5)
  21. # 复制
  22. driver.find_element(By.ID, 'kw').send_keys(Keys.CONTROL,'c')
  23. # 设置等待时间
  24. time.sleep(5)
  25. # 关闭浏览器
  26. driver.quit()

 一下是全选到的内容

三、复制

复制使用Keys.CONTROL，后面加c，进行复制，完全模拟快捷键ctrl+c,将输入框内的文字进行复制下来，代码如下：

  1. import time
  2.  
  3. import pyperclip
  4. from selenium import webdriver
  5. from selenium.webdriver.common.by import By
  6. from selenium.webdriver.common.keys import Keys
  7. # 实例化浏览器
  8. driver = webdriver.Chrome()
  9. # 窗口最大化
  10. driver.maximize_window()
  11. # 打开百度网页
  12. driver.get("https://www.baidu.com")
  13. # 设置等待时间
  14. time.sleep(2)
  15. # 输入框输入信息
  16. driver.find_element(By.ID,'kw').send_keys("复制")
  17. # 全选
  18. driver.find_element(By.ID, 'kw').send_keys(Keys.CONTROL,'a')
  19. # 复制
  20. driver.find_element(By.ID, 'kw').send_keys(Keys.CONTROL,'c')
  21. # 设置等待时间
  22. time.sleep(2)
  23. # 复制
  24. driver.find_element(By.ID, 'kw').send_keys(Keys.CONTROL,'c')
  25. # 设置等待时间
  26. time.sleep(2)
  27. # 使用 pyperclip 获取剪贴板内容
  28. copied_text = pyperclip.paste()
  29. print(copied_text)
  30. # 关闭浏览器
  31. driver.quit()

可以通过剪切板查看是否复制如下图

也可以通过pyperclip模块进行查看 打印出来：

四、粘贴

复制使用Keys.CONTROL，后面加v，进行粘贴，完全模拟快捷键ctrl+a,将剪切板内的内容粘贴到输入框中。保证你的剪切板内存在数据，代码如下：

  1. import time
  2.  
  3. from selenium import webdriver
  4. from selenium.webdriver.common.by import By
  5. from selenium.webdriver.common.keys import Keys
  6. # 实例化浏览器
  7. driver = webdriver.Chrome()
  8. # 窗口最大化
  9. driver.maximize_window()
  10. # 打开百度网页
  11. driver.get("https://www.baidu.com")
  12. # 设置等待时间
  13. time.sleep(2)
  14. # 粘贴
  15. driver.find_element(By.ID, 'kw').send_keys(Keys.CONTROL,'v')
  16. # 设置等待时间
  17. time.sleep(2)
  18. # 关闭浏览器
  19. driver.quit()

五、空格

输入框输入空格，使用Kys.SPACE 进行输入空格

  1. import time
  2.  
  3. from selenium import webdriver
  4. from selenium.webdriver.common.by import By
  5. from selenium.webdriver.common.keys import Keys
  6.  
  7. # 实例化浏览器
  8. driver = webdriver.Chrome()
  9. # 窗口最大化
  10. driver.maximize_window()
  11. # 打开百度网页
  12. driver.get("https://www.baidu.com")
  13. # 设置等待时间
  14. time.sleep(2)
  15. # 输入
  16. driver.find_element(By.ID, 'kw').send_keys(Keys.SPACE)
  17.  
  18. time.sleep(5)
  19. # 关闭浏览器
  20. driver.quit()

六、删除

 输入框输入python，使用Kys.BACKSPACE 进行删除末位n,其中BACKSPACE与BACL_SPACE是一样的，都是删除。

二、alert弹窗、下拉框、窗口切换

一、alert弹窗

alert弹窗是系统内自带的，无法通过元素定位来进行操作，但是selenium中提供了alert方法进行使用，alert弹窗分为三种类型：

  1. alert（警告信息）
  2. confirm（确认信息）
  3. prompt（提示输入）

 测试页面代码

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6.     <title>Alert 和 Prompt 弹窗示例</title>
  7. </head>
  8. <body>
  9.  
  10. <button id="alert" onclick="showSimpleAlert()">显示纯文本弹窗</button>
  11. <button id="confirm" onclick="showConditionalAlert()">选择确认或者取消的弹窗</button>
  12. <button  id="prompt" onclick="showInputAlert()">显示带有输入框的弹窗</button>
  13.  
  14. <script>
  15.     // 显示纯文本弹窗
  16.     function showSimpleAlert() {
  17.         alert("这是一个纯文本的警告框！");
  18.     }
  19.  
  20.     // 根据输入显示不同弹窗
  21.     function showConditionalAlert() {
  22.         confirm("你好，用户")
  23.    }
  24.     // 显示带有输入框的弹窗，并将输入内容显示在另一个弹窗中
  25.     function showInputAlert() {
  26.         let userInput = prompt("请输入一些内容：");
  27.         if (userInput) { // 如果用户没有取消且输入了内容
  28.             alert("你输入了：" + userInput);
  29.         } else {
  30.             alert("你取消了输入！");
  31.         }
  32.     }
  33. </script>
  34.  
  35. </body>
  36. </html>

 代码如下：

  1. import time
  2.  
  3. from selenium import webdriver
  4. from selenium.webdriver.common.by import By
  5.  
  6. # 初始化浏览器
  7. driver = webdriver.Chrome()
  8. # 窗口最大化
  9. driver.maximize_window()
  10. # 打开测试文件
  11. driver.get("http://localhost:63342/WebAuto/day4/alert%E5%BC%B9%E7%AA%97.html")
  12. # 设置等待时间
  13. time.sleep(3)
  14. # 点击按钮，弹出alert弹窗
  15. driver.find_element(By.ID, "alert").click()
  16. time.sleep(2)
  17. # 点击确认
  18. driver.switch_to.alert.accept()
  19. time.sleep(3)
  20. # 点击按钮，弹出confirm弹窗
  21. driver.find_element(By.ID, "confirm").click()
  22. time.sleep(2)
  23. # 点击取消
  24. driver.switch_to.alert.dismiss()
  25. time.sleep(3)
  26. # 点击按钮，弹出prompt弹窗
  27. driver.find_element(By.ID, "prompt").click()
  28. time.sleep(2)
  29. # 输入内容
  30. driver.switch_to.alert.send_keys("hello")
  31. time.sleep(3)
  32. # 点击确认
  33. driver.switch_to.alert.accept()
  34. time.sleep(2)

二、下拉框操作

 下拉框操作有两种方式可以使用，第一种直接模拟手动点击，第二种是使用select方法进行操作，包括了使用索引（select_by_index）进行选择，直接指定值(select_by_value)进行。

测试页面代码

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. 	<meta charset="utf-8">
  5. 	<meta name="viewport" content="width=device-width, initial-scale=1">
  6. 	<title></title>
  7. </head>
  8. <body>
  9. 	编程语言:<select>
  10. 		<option>Java</option>
  11. 		<option>C++</option>
  12. 		<option value="Python">Python</option>
  13. 		<option>HTML</option>
  14. 		<option>JavaScript</option>
  15. 	</select>
  16. </body>
  17. </html>

代码实现如下：

  1. '''
  2. 下拉框
  3. '''
  4. import time
  5.  
  6. import selenium.webdriver as webdriver
  7. from selenium.webdriver.common.by import By
  8. from selenium.webdriver.support import select
  9. # 初始化驱动
  10. driver = webdriver.Chrome()
  11. # 窗口最大化
  12. driver.maximize_window()
  13.  
  14. # 访问网址
  15. driver.get('http://localhost:63342/WebAuto/day4/test.html')
  16. time.sleep(2)
  17. # 老办法
  18. driver.find_element(By.XPATH,'//select').click()
  19. time.sleep(2)
  20. driver.find_element(By.XPATH,'//select/option[2]').click()
  21. # 下拉框
  22. select = select.Select(driver.find_element(By.XPATH, '//select'))
  23. # 通过索引下拉选择
  24. select.select_by_index(2)
  25. time.sleep(3)
  26. # 通过输入值下拉选择
  27. select.select_by_value('HTML')
  28. time.sleep(5)
  29.  
  30. driver.quit()

三、窗口切换

 在进行页面访问时，像点击天猫商城时，页面会自动跳转，这个时候如何进行元素定位点击会报错元素找不到，造成这种的原因是当前的drivern的窗口句柄为第一个页面，并不是自动跳转的页面，这个时候就需要切换句柄使用，先使用

driver.window_handles #获取窗口句柄

之后再去使用索引切换窗口 ，索引：从左往右看是从0开始，为第一个窗口；从右往左看是从-1开始

driver.switch_to.window(win[索引])

测试页面

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Iframe Navigation Example</title>
  6.     <style>
  7.         .wrap {
  8.             display: flex;
  9.         }
  10.         .aside-wrap {
  11.             flex: 1;
  12.             background-color: #f4f4f4;
  13.         }
  14.         .nab-list {
  15.             list-style: none;
  16.             padding: 0;
  17.         }
  18.         .nav-item {
  19.             margin-bottom: 5px;
  20.         }
  21.         .nav-lk {
  22.             display: block;
  23.             padding: 10px;
  24.             background-color: #ddd;
  25.             color: black;
  26.             text-decoration: none;
  27.         }
  28.         .nav-lk:hover {
  29.             background-color: #ccc;
  30.         }
  31.         .frame-wrap {
  32.             flex: 4;
  33.         }
  34.         iframe {
  35.             width: 100%;
  36.             height: 600px; /* You can adjust the height as needed */
  37.             border: none;
  38.         }
  39.     </style>
  40. </head>
  41. <body>
  42. <div class="wrap">
  43.     <aside class="aside-wrap">
  44.         <ul class="nab-list">
  45.             <li class="nav-item">
  46.                 <a href="https://www.taobao.com" target="navIframe" class="nav-lk">淘宝商城</a>
  47.             </li>
  48.             <li class="nav-item">
  49.                 <a href="https://www.tmall.com" target="navIframe" class="nav-lk">天猫商城</a>
  50.             </li>
  51.             <li class="nav-item">
  52.                 <a href="https://www.suning.com" target="navIframe" class="nav-lk">苏宁商城</a>
  53.             </li>
  54.         </ul>
  55.     </aside>
  56.     <section class="frame-wrap">
  57.         <iframe src="https://www.taobao.com" name="navIframe1"></iframe>
  58.         <iframe src="https://www.tmall.com" name="navIframe2"></iframe>
  59.         <iframe src="https://www.suning.com" name="navIframe3"></iframe>
  60.     </section>
  61. </div>
  62. <script>
  63.     // You might want to add some JavaScript here if needed
  64. </script>
  65. </body>
  66. </html>

页面跳转之后返回第一个页面，代码实现如下 

  1. import time
  2.  
  3. import selenium.webdriver as webdriver
  4. from selenium.webdriver.common.by import By
  5.  
  6. # 初始化驱动
  7.  
  8. driver = webdriver.Chrome()
  9. # 窗口最大化
  10. driver.maximize_window()
  11.  
  12. # 访问网址
  13. driver.get('http://localhost:63342/WebAuto/day4/main.html')
  14. time.sleep(2)
  15.  
  16. #点击天猫
  17. driver.find_element(By.XPATH,'//ul/li[2]').click()
  18. time.sleep(5)
  19.  
  20. #切换窗口
  21. win = driver.window_handles #获取窗口句柄
  22. # 切回到第一个窗口
  23. driver.switch_to.window(win[0])
  24. time.sleep(10)

如何不切换窗口直接点击天猫内商品，报错报错： NoSuchElementException，代码如下：

  1. import time
  2.  
  3. import selenium.webdriver as webdriver
  4. from selenium.webdriver.common.by import By
  5.  
  6. # 初始化驱动
  7.  
  8. driver = webdriver.Chrome()
  9. # 窗口最大化
  10. driver.maximize_window()
  11.  
  12. # 访问网址
  13. driver.get('http://localhost:63342/WebAuto/day4/main.html')
  14. time.sleep(2)
  15. #点击天猫
  16. driver.find_element(By.XPATH,'//ul/li[2]').click()
  17. time.sleep(5)
  18. # #切换窗口
  19. # win = driver.window_handles #获取窗口句柄
  20. # # 切回到第一个窗口
  21. # driver.switch_to.window(win[0])
  22. time.sleep(2)
  23. driver.find_element(By.XPATH,'//ul[@class="sn-quick-menu"]/li[1]/div/a').click()
  24. time.sleep(10)

报错：

正确代码如下： 

  1. import time
  2.  
  3. import selenium.webdriver as webdriver
  4. from selenium.webdriver.common.by import By
  5.  
  6. # 初始化驱动
  7.  
  8. driver = webdriver.Chrome()
  9. # 窗口最大化
  10. driver.maximize_window()
  11.  
  12. # 访问网址
  13. driver.get('http://localhost:63342/WebAuto/day4/main.html')
  14. time.sleep(2)
  15.  
  16. #点击天猫
  17. driver.find_element(By.XPATH,'//ul/li[2]').click()
  18. time.sleep(5)
  19.  
  20.  
  21. #切换窗口
  22. win = driver.window_handles #获取窗口句柄
  23. # 切换到当前窗口
  24. driver.switch_to.window(win[1])
  25. time.sleep(2)
  26. driver.find_element(By.XPATH,'//ul[@class="sn-quick-menu"]/li[1]/div/a').click()
  27. time.sleep(10)

三、复选框、滑动模块、页面刷新（后退，前进）

一、复选框

 复选框可以直接定位到方框的元素进行点击

 测试页面：

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. 	<meta charset="utf-8">
  5. 	<meta name="viewport" content="width=device-width, initial-scale=1">
  6. 	<title></title>
  7. </head>
  8. <body>
  9. 	用户名：<input type="text" name="user_name">
  10. 	密码：<input type="password" name="pwd">
  11. 	<input type="checkbox" name="Java">Java
  12. 	<input type="checkbox" name="Python">Python
  13. 	<input type="checkbox" name="C++">C++
  14. 	<input type="checkbox" name="JavaScript">JavaScript
  15. 	<input type="checkbox" name="HTML">HTML
  16. </body>
  17. </html>

代码实现：

  1. import time
  2.  
  3. import selenium.webdriver as webdriver
  4. from selenium.webdriver.common.by import By
  5.  
  6. # 初始化驱动
  7.  
  8. driver = webdriver.Chrome()
  9. # 窗口最大化
  10. driver.maximize_window()
  11.  
  12. # 访问网址
  13. driver.get('D:\\宏软\\WebAuto\\day4\\checkbox.html')
  14. time.sleep(2)
  15. # 点击复选框
  16. driver.find_element(By.XPATH,'//body/input[4]').click()
  17. time.sleep(5)
  18. driver.quit()

 二、滑动模块

如果遇到滑块问题，如何解决？认为是如何解决的呢，使用鼠标指针进行操作，在selenium中也有指针操作，ActionChains模块模拟指针操作。

测试页面

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>滑块解锁封装js方法</title>
  6.     <!--注：这里首次用到了iconfont的语法，即矢量图标-->
  7.     <link rel="stylesheet" href="font/iconfont.css">
  8.     <style>
  9.         *{
  10.             padding: 0;
  11.             margin: 0;
  12.         }
  13.         #box{
  14.             position: relative;
  15.             width: 300px;
  16.             height: 40px;
  17.             margin: 0 auto;
  18.             margin-top: 10px; 
  19.             background-color: #e8e8e8;
  20.             box-shadow: 1px 1px 5px rgba(0,0,0,0.2);
  21.         }
  22.         .bgColor{
  23.             position: absolute;
  24.             left:0;
  25.             top:0;
  26.             width:40px;
  27.             height: 40px;
  28.             background-color: lightblue;
  29.         }
  30.         .txt{
  31.             position: absolute;
  32.             width: 100%;
  33.             height: 40px;
  34.             line-height: 40px;
  35.             font-size: 14px;
  36.             color: #000;
  37.             text-align: center;
  38.         }
  39.         .slider{
  40.             position: absolute;
  41.             left:0;
  42.             top:0;
  43.             width: 50px;
  44.             height: 38px;
  45.             border: 1px solid #ccc;
  46.             background: #fff;
  47.             text-align: center;
  48.             cursor: move;
  49.         }
  50.         .slider>i{
  51.             position: absolute;
  52.             top:50%;
  53.             left:50%;
  54.             transform: translate(-50%,-50%);
  55.         }
  56.         .slider.active>i{
  57.             color:green;
  58.         }//其实这个图片显示的内容就是"<<"符号。
  59. 	.btn {
  60. 			position: absolute;
  61. 			width: 40px;
  62. 			height: 32px;
  63. 			background: #fff url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDIxIDc5LjE1NTc3MiwgMjAxNC8wMS8xMy0xOTo0NDowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo0ZDhlNWY5My05NmI0LTRlNWQtOGFjYi03ZTY4OGYyMTU2ZTYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NTEyNTVEMURGMkVFMTFFNEI5NDBCMjQ2M0ExMDQ1OUYiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NTEyNTVEMUNGMkVFMTFFNEI5NDBCMjQ2M0ExMDQ1OUYiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTQgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo2MTc5NzNmZS02OTQxLTQyOTYtYTIwNi02NDI2YTNkOWU5YmUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NGQ4ZTVmOTMtOTZiNC00ZTVkLThhY2ItN2U2ODhmMjE1NmU2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+YiRG4AAAALFJREFUeNpi/P//PwMlgImBQkA9A+bOnfsIiBOxKcInh+yCaCDuByoswaIOpxwjciACFegBqZ1AvBSIS5OTk/8TkmNEjwWgQiUgtQuIjwAxUF3yX3xyGIEIFLwHpKyAWB+I1xGSwxULIGf9A7mQkBwTlhBXAFLHgPgqEAcTkmNCU6AL9d8WII4HOvk3ITkWJAXWUMlOoGQHmsE45ViQ2KuBuASoYC4Wf+OUYxz6mQkgwAAN9mIrUReCXgAAAABJRU5ErkJggg==) center no-repeat;
  64. 			background-size: 13px;//不设置这个属性，背景图片会不成比例的显示
  65. 			border: 1px solid #ccc;
  66. 			cursor: move;
  67. 	}
  68.     </style>
  69. </head>
  70. <body>
  71.     <div id="box" onselectstart="return false;">
  72.         <div class="bgColor"></div>
  73.         <div class="txt" >滑动解锁</div>
  74.         <!--给i标签添加上相应字体图标的类名即可-->
  75.         <div class="slider"><i class="iconfont icon-double-right"></i></div>
  76.     </div>  
  77.     <script>
  78.         //一、定义了一个获取元素的方法
  79.         function getEle(selector){
  80.             return document.querySelector(selector);
  81.         }
  82.         //二、获取到需要用到的DOM元素
  83.         var box = getEle("#box"),//容器
  84.             bgColor = getEle(".bgColor"),//背景色
  85.             txt = getEle(".txt"),//文本
  86.             slider = getEle(".slider"),//滑块
  87.             icon = getEle(".slider>i"),
  88.             successMoveDistance = box.offsetWidth- slider.offsetWidth,//解锁需要滑动的距离
  89.             downX,//用于存放鼠标按下时的位置
  90.             isSuccess = false;//是否解锁成功的标志，默认不成功
  91.  
  92.         //三、给滑块添加鼠标按下事件
  93.         slider.onmousedown = mousedownHandler;
  94.  
  95.         //3.1鼠标按下事件的方法实现
  96.         function mousedownHandler(e){
  97.             bgColor.style.transition = "";
  98.             slider.style.transition = "";
  99.             var e = e || window.event || e.which;
  100.             downX = e.clientX;
  101.             //在鼠标按下时，分别给鼠标添加移动和松开事件
  102.             document.onmousemove = mousemoveHandler;
  103.             document.onmouseup = mouseupHandler;
  104.         };
  105.  
  106.         //四、定义一个获取鼠标当前需要移动多少距离的方法
  107.         function getOffsetX(offset,min,max){
  108.             if(offset < min){
  109.                 offset = min;
  110.             }else if(offset > max){
  111.                 offset = max;
  112.             }
  113.             return offset;
  114.         }
  115.  
  116.         //3.1.1鼠标移动事件的方法实现
  117.         function mousemoveHandler(e){
  118.             var e = e || window.event || e.which;
  119.             var moveX = e.clientX;
  120.             var offsetX = getOffsetX(moveX - downX,0,successMoveDistance);
  121.             bgColor.style.width = offsetX + "px";
  122.             slider.style.left = offsetX + "px";
  123.  
  124.             if(offsetX == successMoveDistance){
  125.                 success();
  126.             }
  127.             //如果不设置滑块滑动时会出现问题（目前还不知道为什么）
  128.             e.preventDefault();
  129.         };
  130.  
  131.         //3.1.2鼠标松开事件的方法实现
  132.         function mouseupHandler(e){
  133.             if(!isSuccess){
  134.                 bgColor.style.width = 0 + "px";
  135.                 slider.style.left = 0 + "px";
  136.                 bgColor.style.transition = "width 0.8s linear";
  137.                 slider.style.transition = "left 0.8s linear";
  138.             }
  139.             document.onmousemove = null;
  140.             document.onmouseup = null;
  141.         };
  142.  
  143.         //五、定义一个滑块解锁成功的方法
  144.         function success(){
  145.             isSuccess = true;
  146.             txt.innerHTML = "解锁成功";
  147.             bgColor.style.backgroundColor ="lightgreen";
  148.             slider.className = "slider active";
  149.             icon.className = "iconfont icon-xuanzhong";
  150.             //滑动成功时，移除鼠标按下事件和鼠标移动事件
  151.             slider.onmousedown = null;
  152.             document.onmousemove = null;
  153.         };
  154.     </script>
  155. </body>
  156. </html>

代码实现操作：

  1. import time
  2.  
  3. from selenium import webdriver
  4. from selenium.webdriver import ActionChains
  5. from selenium.webdriver.common.by import By
  6.  
  7. # 初始化驱动
  8.  
  9. driver = webdriver.Chrome()
  10. # 窗口最大化
  11. driver.maximize_window()
  12.  
  13. # 访问网址
  14. driver.get('http://localhost:63342/WebAuto/day4/%E6%BB%91%E5%8A%A8%E9%AA%8C%E8%AF%81.html')
  15. time.sleep(2)
  16. # 滑块定位
  17. el = driver.find_element(By.XPATH, '//div[@id="box"]/div[3]')
  18. # 使用指针将滑块按住并移动，之后释放
  19. ActionChains(driver).click_and_hold(el).move_by_offset(300, 0).perform()
  20.  
  21. #获取执行结果
  22. res = driver.find_element(By.XPATH,'//div[@id="box"]/div[2]').text
  23. if res == "解锁成功":
  24.     print("用例通过")
  25. else:
  26.     print("用例失败")
  27. #释放事件链
  28. ActionChains(driver).release()
  29. time.sleep(5)
  30. driver.quit()

指针也提供了click方法，点击方法与driver.find_element(By.XPATH,'//div[@id="box"]/div[3]').click()一致，如下：

ActionChains(driver).click(el).perform()

 三、页面刷新、后退一页、前进一页：

selenium提供了页面刷新，前进和后退的操作，对应在浏览器上的相应操作后退，前进，刷新

 对应的方法back(后退)、forward(前进)、refresh（刷新），代码如下：

  1. import time
  2. # 导入selenium包
  3. from selenium import webdriver
  4. from selenium.webdriver.common.by import By
  5.  
  6. # 启动并打开指定页面
  7. driver = webdriver.Chrome()
  8. driver.get("http://www.csdn.net")
  9. driver.maximize_window()
  10. driver.find_element(By.LINK_TEXT, 'Python').click()
  11. #停留2秒
  12. time.sleep(2)
  13. # 刷新页面
  14. driver.refresh()
  15. # 停留2秒
  16. time.sleep(2)
  17. # 页面后退一页
  18. driver.back()
  19. # 停留2秒
  20. time.sleep(2)
  21. # 前进一页
  22. driver.forward()
  23. # 关闭页面
  24. time.sleep(3)
  25.  
  26. driver.quit()

四、内联框架

frame ：HTML页面中的一种框架，主要作用是在当前页面中指定区域显示另一页面元素 。<iframe>标签规定一个内联框架,一个内联框架被用来在当前 HTML 文档中嵌入另一个文档,通过使用框架，你可以在同一个浏览器窗口中显示不止一个页面。

所以在我们进行操作时，明明就是当前页面，元素就是定位不到，需要考虑是否存在问题，下列是两个页面代码，其中index.html为主页面，存在frame内联框架，而iframe_content.html为被嵌入的页面

  1. <!-- index.html -->
  2. <!DOCTYPE html>
  3. <html lang="en">
  4. <head>
  5.     <meta charset="UTF-8">
  6.     <title>带内联框架的页面</title>
  7.     <style>
  8.         iframe {
  9.             width: 100%;
  10.             height: 200px;
  11.             border: none;
  12.         }
  13.     </style>
  14. </head>
  15. <body>
  16.  
  17.     <h1>带内联框架的页面</h1>
  18.  
  19.     <!-- 内联框架 -->
  20.     <iframe id="myIframe" src="iframe_content.html"></iframe>
  21.  
  22. </body>
  23. </html>
  24.  
  1. <!-- iframe_content.html -->
  2. <!DOCTYPE html>
  3. <html lang="en">
  4. <head>
  5.     <meta charset="UTF-8">
  6.     <title>内联框架内容</title>
  7. </head>
  8. <body>
  9.  
  10.     <h2>在内联框架内输入信息</h2>
  11.  
  12.     <!-- 输入框表单 -->
  13.     <form onsubmit="return handleFormSubmit();">
  14.         <label for="userInput">输入信息:</label>
  15.         <input type="text" id="userInput" name="userInput">
  16.         <input type="submit" value="提交">
  17.     </form>
  18.  
  19.     <script>
  20.         function handleFormSubmit() {
  21.             var userInput = document.getElementById('userInput').value;
  22.             // 这里可以添加代码来处理输入信息
  23.             // 例如，将输入信息显示在iframe内或发送到服务器
  24.  
  25.             // 阻止表单的默认提交行为
  26.             alert('输入内容：' + userInput); // 显示输入内容的简单示例
  27.             return false;
  28.         }
  29.     </script>
  30.  
  31. </body>
  32. </html>

往输入框输入文字，需要跳转到frame内联框架中，否则会报错，NoSuchElement,代码如下：

  1. from selenium import webdriver
  2. from selenium.webdriver.common.by import By
  3. import time
  4.  
  5.  
  6. # 实例化浏览器对象
  7. driver = webdriver.Chrome()
  8. # 打开网页
  9. driver.get("http://localhost:63342/python_project/apiauto/index.html")
  10. # 最大化窗口
  11. driver.maximize_window()
  12. # 等待2秒
  13. time.sleep(2)
  14. #进入内联框架
  15. driver.switch_to.frame("myIframe")
  16. # 等待2秒
  17. time.sleep(2)
  18. # 输入内容
  19. driver.find_element(By.ID,"userInput").send_keys("selenium")
  20. time.sleep(2)
  21. # 跳出内联框架
  22. driver.switch_to.default_content()
  23. # 获取内联框架外的h1标签内容
  24. print(driver.find_element(By.XPATH,'/html/body/h1').text)
  25. driver.quit()

使用switch_to.frame(),进入到内联框架，之后再使用switch_to.default_content()跳出内联框架回去文本。

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/从前慢现在也慢/article/detail/893057
推荐阅读
相关标签

Copyright © 2003-2013 www.wpsshop.cn 版权所有，并保留所有权利。

  

闽ICP备14008679号