selenium中ActionChains方法详细讲解

这篇具有很好参考价值的文章主要介绍了selenium中ActionChains方法详细讲解。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

前言

   本文将介绍Selenium中的ActionChains类及其使用方法,帮助您模拟用户在网页上的鼠标和键盘操作。了解ActionChains的常用方法和示例代码,可轻松实现移动鼠标、点击元素、拖拽元素等操作。通过本文的学习,您能更好地应用ActionChains解决自动化测试或网页爬取中的问题。

演示html文件

<!DOCTYPE html>
<html>

<head>
  <title>操作HTML示例</title>
  <script>
    function clickButton() {
      var button = document.getElementById("clickButton");
      button.click();
    }

    function doubleClickButton() {
      var button = document.getElementById("doubleClickButton");
      var event = new MouseEvent('dblclick', { bubbles: true, cancelable: true });
      button.dispatchEvent(event);
    }

    function initSlider() {
      var slider_1 = document.getElementById("slider_1");
      var isDragging = false;
      var offset = { x: 0, y: 0 };

      slider_1.addEventListener("mousedown", startDrag);
      slider_1.addEventListener("mouseup", stopDrag);
      slider_1.addEventListener("mousemove", drag);
      slider_1.addEventListener("mouseleave", stopDrag);

      function startDrag(e) {
        isDragging = true;
        offset.x = e.clientX - slider_1.offsetLeft;
        offset.y = e.clientY - slider_1.offsetTop;
      }

      function stopDrag() {
        isDragging = false;
      }

      function drag(e) {
        if (isDragging) {
          var newX = e.clientX - offset.x;
          var newY = e.clientY - offset.y;

          slider_1.style.left = newX + "px";
          slider_1.style.top = newY + "px";
        }
      }
    }

	function handleKeyUp(event) {
      if (event.keyCode === 119) {
        // F8键的keycode为119
        alert("释放了F8键");
    }
  }
  </script>
</head>

<body>
  <h1>操作HTML示例</h1>

  <button id="clickButton" onclick="alert('单击按钮')">单击按钮</button>
  <button id="doubleClickButton" ondblclick="alert('双击按钮')">双击按钮</button>

  <div>
    <input id="slider" type="range" min="0" max="100" step="1" value="50" style="width: 200px;">
    <input id="slider_2" type="range" min="0" max="100" step="1" value="50"
      style="height: 200px; transform: rotate(270deg);">
  </div>

  <div id="box" style="width: 230px; height: 200px; background-color: lightblue; position: relative;">
    <div id="slider_1"
      style="width: 30px; height: 30px; background-color: red; position: absolute; top: 80px; left: 100px; cursor: move;">
    </div>
  </div>

  <script>
   window.addEventListener("load", initSlider);
   window.addEventListener("keyup", handleKeyUp);
  </script>
</body>

</html>

一、使用方法

1、方法说明

方法 说明 参数
move_to_element(element) 将鼠标移动到指定元素上方 element: 要移动到的目标元素
click() 左键单击当前鼠标位置
click_and_hold() 按住并且不释放鼠标左键
release() 释放鼠标左键
context_click() 右键单击当前鼠标位置
double_click() 双击当前鼠标位置
drag_and_drop(source, target) 将一个元素从源位置拖拽到目标位置 source: 要拖动的源元素
target: 要拖动到的目标元素
drag_and_drop_by_offset(source, xoffset, yoffset) 将一个元素从源位置按指定偏移量拖拽到目标位置 source: 要拖动的源元素
xoffset: 横向偏移量
yoffset: 纵向偏移量
move_by_offset(xoffset, yoffset) 将鼠标相对于当前位置按指定偏移量移动 xoffset: 横向偏移量
yoffset: 纵向偏移量
key_down(value, element=None) 模拟按下某个键盘按键,可选择指定元素 value: 要按下的键盘按键值
element(可选): 要操作的元素
key_up(value, element=None) 模拟释放某个键盘按键,可选择指定元素 value: 要释放的键盘按键值
element(可选): 要操作的元素
pause(seconds) 暂停执行一段时间 seconds: 暂停的时间,单位为秒
perform() 执行已定义的操作序列

2、左键单击当前鼠标位置

from selenium import webdriver
from selenium.webdriver.common.action_chains import ActionChains


# 创建Chrome浏览器的WebDriver实例
driver = webdriver.Chrome()
# 最大化窗口
driver.maximize_window()
# 打开网页
driver.get("file:///C:/Users/admin/Desktop/Demo.html")

# 创建 actions 的 ActionChains 对象
actions = ActionChains(driver)

# 定位到需要点击的按钮
click = driver.find_element_by_css_selector('[id="clickButton"]')
# 将鼠标移动到按钮上
actions.move_to_element(click)
# 鼠标左键
actions.click()
# 执行操作(必须要有该方法,否则操作不会执行)
actions.perform()

# 简化代码
click = driver.find_element_by_css_selector('[id="clickButton"]')
ActionChains(driver).move_to_element(click).click().perform()

3、双击当前鼠标位置

from selenium import webdriver
from selenium.webdriver.common.action_chains import ActionChains


# 创建Chrome浏览器的WebDriver实例
driver = webdriver.Chrome()
# 最大化窗口
driver.maximize_window()
# 打开网页
driver.get("file:///C:/Users/admin/Desktop/Demo.html")

# 创建 actions 的 ActionChains 对象
actions = ActionChains(driver)

# 定位到需要点击的按钮
click = driver.find_element_by_css_selector('[id="doubleClickButton"]')
# 将鼠标移动到按钮上
actions.move_to_element(click)
# 鼠标双击
actions.double_click()
# 执行操作(必须要有该方法,否则操作不会执行)
actions.perform()

4、鼠标拖拽元素移动

  • 场景一
from selenium import webdriver
from selenium.webdriver.common.action_chains import ActionChains


# 创建Chrome浏览器的WebDriver实例
driver = webdriver.Chrome()
# 最大化窗口
driver.maximize_window()
# 打开网页
driver.get("file:///C:/Users/admin/Desktop/Demo.html")

# 创建 actions 的 ActionChains 对象
actions = ActionChains(driver)

# 定位到需要拖拽的滑块元素
slider = driver.find_element_by_css_selector('[id="slider_1"]')

# 将鼠标移动到滑块上
actions.move_to_element(slider)

# 执行鼠标左键点击并按住不放
actions.click_and_hold()

# 设置每次移动的偏移量
offset = 7

# 模拟滑块的连续移动
for i in range(10):
    # 向右移动 offset 像素
    actions.move_by_offset(offset, 0)
    actions.pause(0.1)  # 添加暂停时间以控制移动速度

# 向左移动 offset 像素
for i in range(10):
    actions.move_by_offset(-offset, 0)
    actions.pause(0.1)

# 向下移动 offset 像素
for i in range(10):
    actions.move_by_offset(0, offset)
    actions.pause(0.1)

# 向上移动 offset 像素
for i in range(10):
    actions.move_by_offset(0, -offset)
    actions.pause(0.1)

# 释放鼠标左键
actions.release()

# 执行操作
actions.perform()
  • 场景二
from selenium import webdriver
from selenium.webdriver.common.action_chains import ActionChains


# 创建Chrome浏览器的WebDriver实例
driver = webdriver.Chrome()
# 最大化窗口
driver.maximize_window()
# 打开网页
driver.get("file:///C:/Users/admin/Desktop/Demo.html")

# 创建 actions 的 ActionChains 对象
actions = ActionChains(driver)

# 定位到需要拖拽的滑块元素
slider = driver.find_element_by_css_selector('[id="slider"]')
# 滑动到指定位置
actions.drag_and_drop_by_offset(slider, 80, 0)


# 定位到需要拖拽的滑块元素
slider_2 = driver.find_element_by_css_selector('[id="slider_2"]')
# 将鼠标移动到滑块上
actions.move_to_element(slider_2)
# 执行鼠标左键点击并按住不放
actions.click_and_hold()
# 滑动到指定位置
actions.move_by_offset(0, 50)
# 释放鼠标左键
actions.release()

# 执行操作
actions.perform()

selenium actionchains,# web篇,selenium,python文章来源地址https://www.toymoban.com/news/detail-772048.html

5、模拟键盘按键

from selenium import webdriver
from selenium.webdriver.common.action_chains import ActionChains
from selenium.webdriver.common.keys import Keys

# 创建Chrome浏览器的WebDriver实例
driver = webdriver.Chrome()
# 最大化窗口
driver.maximize_window()
# 打开网页
driver.get("file:///C:/Users/admin/Desktop/Demo.html")

# 创建 actions 的 ActionChains 对象
actions = ActionChains(driver)

# 定位到需要拖拽的滑块元素
slider = driver.find_element_by_css_selector('[id="slider"]')

# 模拟按下右键,滑块移动. 键盘键码自行百度
actions.key_down(Keys.ARROW_RIGHT, slider)

# 模拟按下F8键
actions.key_down(Keys.F8)
# 模拟释放F8键
actions.key_up(Keys.F8)

# 执行操作
actions.perform()

6、下拉列表滚动

  • 示例HTML文件
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>选择框</title>
    <style>
        /* 样式可根据需要自行修改 */
        .select-box {
            position: relative;
            display: inline-block;
            width: 150px;
            height: 30px;
            border: 1px solid #aaa;
        }
        .select-box:hover {
            cursor: pointer;
        }
        .select-box > .selected-item {
            display: block;
            width: 100%;
            height: 100%;
            line-height: 30px;
            padding: 0 10px;
        }
        .select-box > .options {
            position: absolute;
            top: 100%;
            left: 0;
            z-index: 99;
            display: none;
            width: 100%;
            max-height: 200px;
            overflow-y: auto;
            border: 1px solid #aaa;
            background-color: #fff;
        }
        .select-box > .options > div {
            width: 100%;
            height: 30px;
            line-height: 30px;
            padding: 0 10px;
        }
        .select-box > .options > div:hover {
            background-color: #ccc;
            cursor: pointer;
        }
    </style>
</head>
<body>
    <div class="select-box">
        <div class="selected-item">请选择</div>
        <div class="options">
            <div>选项1</div>
            <div>选项2</div>
            <div>选项3</div>
            <div>选项4</div>
            <div>选项5</div>
            <div>选项6</div>
            <div>选项7</div>
			<div>选项8</div>
			<div>选项9</div>
			<div>选项10</div>
			<div>选项11</div>
			<div>选项12</div>
			<div>选项13</div>
			<div>选项14</div>
			<div>选项15</div>
			<div>选项16</div>
			<div>选项17</div>
			<div id="test">选项18</div>
            <!-- 这里添加更多的选项 -->
        </div>
    </div>
    <script>
		var selectBox = document.querySelector('.select-box');
		var selectedItem = selectBox.querySelector('.selected-item');
		var options = selectBox.querySelector('.options');

		// 点击选择框时,切换选项列表的显示/隐藏状态
		selectBox.addEventListener('click', function() {
			if (options.style.display === 'none' || options.style.display === '') {
				options.style.display = 'block';
			} else {
				options.style.display = 'none';
			}
		});
		// 点击选项时,将选项值赋值到选择框上方的文本框中,并隐藏选项列表
		options.addEventListener('click', function(e) {
			if (e.target.tagName.toLowerCase() === 'div') {
				selectedItem.innerHTML = e.target.innerHTML;
				// options.style.display = 'none';
			}
		});
    </script>
</body>
</html>
  • 滚动方法
from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.common.action_chains import ActionChains
from selenium.webdriver.common.keys import Keys
from time import sleep

# 创建Chrome浏览器的WebDriver实例
driver = webdriver.Chrome()
# 最大化窗口
driver.maximize_window()
# 打开网页
driver.get("file:///C:/Users/admin/Desktop/Demo.html")

# 点击展开下拉列表
driver.find_element(By.CSS_SELECTOR, '.selected-item').click()

# 定位到需要进行滚动的元素
element = driver.find_element(By.CSS_SELECTOR, '.options')

# 使用鼠标拖拽方式向下滚动10个像素,执行下面的滚动方式时,必须包含这个。
ActionChains(driver).move_to_element(element).click_and_hold().move_by_offset(0, 10).perform()
# 如以上方法使用有问题,就使用该方法
# ActionChains(driver).move_to_element(element).click_and_hold().move_by_offset(0, 10).release().perform()
sleep(3)

# 使用键盘按键方式滚动到页面底部
ActionChains(driver).move_to_element(element).send_keys(Keys.END).perform()
sleep(3)

# 使用键盘按键方式滚动到页面顶部
ActionChains(driver).move_to_element(element).send_keys(Keys.HOME).perform()
sleep(3)

# 使用键盘按键方式向下翻一页
ActionChains(driver).move_to_element(element).send_keys(Keys.PAGE_DOWN).perform()
sleep(3)

# 使用键盘按键方式向上翻一页
ActionChains(driver).move_to_element(element).send_keys(Keys.PAGE_UP).perform()
sleep(3)

# 关闭浏览器
driver.quit()

到了这里,关于selenium中ActionChains方法详细讲解的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • UI自动化Selenium ActionChains鼠标(动作链)

    我们在实现UI自动化过程中,有时会遇到鼠标模拟操作,如鼠标悬停后,菜单划出;鼠标按下后,下拉展开;单击、双击、拖动等等;但我们常常对鼠标的单击和双击比较了解(click和doubleclick)但是其他的如何使用呢?且看下面分解: 1、selenium提供了一个类来专门处理鼠标的

    2024年01月18日
    浏览(48)
  • selenium自动化测试入门 —— 键盘鼠标事件ActionChains

    在使用 Selenium WebDriver 做自动化测试的时候,会经常模拟鼠标和键盘的一些行为。比如使用鼠标单击、双击、右击、拖拽等动作;或者键盘输入、快捷键使用、组合键使用等模拟键盘的操作。在 WebDeriver 中,有一个专门的类来负责实现这些测试场景,那就是 ActionChains类,在使

    2024年04月16日
    浏览(38)
  • Python WebDriver API - 鼠标操作ActionChains

    用selenium做自动化,有时候会遇到需要模拟鼠标操作才能进行的情况,比如单击、双击、点击鼠标右键、拖拽等等。而selenium给我们提供了一个类来处理这类事件——ActionChains 当调用ActionChains的方法时,不会立即执行,而是会将所有的操作按顺序存放在一个队列里,当调用p

    2024年02月16日
    浏览(29)
  • 详细讲解!selenium:解决页面元素display:none的方法

    目录 前言: 1、具体问题 2、解决方案 代码解析: 结尾: 前言: 在进行 Web 自动化测试时,页面元素的可见性对测试结果的准确性和稳定性至关重要。然而,有些时候页面元素会被设置为  display:none ,导致自动化测试无法找到或与之交互。 这篇博客,介绍下如何通过JavaS

    2024年02月09日
    浏览(38)
  • selenium+python切换浏览器窗口--详细讲解

    在浏览器页面打开窗口后,有时点击按钮会打开新的页面,我们需要切换到新的窗口才能去定位操作,不然无法操作,切换窗口代码如下

    2024年02月14日
    浏览(45)
  • Python+Selenium4环境搭建与原理讲解_web自动化(1)

    1. 认识Selenium 2. Selenium 三大组件 3. Selenium自动化测试环境搭建 3.1 安装selenium 库 3.2 安装浏览器驱动 1. 查看浏览器版本号 2. 下载浏览器驱动 3. 把driver移动到Path目录 4. 验证driver就绪   3.3 启动浏览器 4. Selenium自动化测试环境的自动化配置 1. 安装依赖 2. 启动浏览器 5. Selenium工作

    2024年02月06日
    浏览(100)
  • 【Python爬虫】selenium的详细使用方法

    selenium是一个用于web应用测试的工具,selenium所做的测试会直接运行在浏览器中,就像真人进行操作一样,像是打开浏览器,输入账号密码登录等等。目前selenium支持大部分的浏览器,例如:IE,Mozilla Firefox,Safari,Google Chrome,Opera,Edge等等浏览器,selenium是一个相当成功的开

    2024年02月07日
    浏览(58)
  • Python WEB UI自动化测试(1)-Selenium基础(史上最详细,一篇就够)

    命令行安装 找到本地chrome的浏览器的版本 下载相应版本的驱动器 chrome浏览器驱动下载 地址:chromedriver.storage.googleapis.com/index.html 下载完后,解压到本地的python的目录下 geckodriver: https://firefox-source-docs.mozilla.org/testing/geckodriver/Support.html edgedriver: https://developer.microsoft.com/en-us/m

    2024年02月03日
    浏览(60)
  • web自动化测试入门篇04——selenium+python基础方法封装

        😏 作者简介:博主是一位测试管理者,同时也是一名对外企业兼职讲师。 📡 主页地址:【Austin_zhai】 🙆 目的与景愿:旨在于能帮助更多的测试行业人员提升软硬技能,分享行业相关最新信息。 💎 声明:博主日常工作较为繁忙,文章会不定期更新,各类行业或职场问

    2024年02月03日
    浏览(52)
  • Python+selenium自动化八大元素定位方法及实例(超详细)

    目录 一、selenium模块中的find_element_by_id方法无法使用 二、Python+selenium自动化八大元素定位方法 使用场景: 1、通过id属性定位:driver.find_element(By.ID,\\\"value\\\") 2、通过name属性定位:driver.find_element(By.NAME,\\\"value\\\") 3、通过class属性定位:driver.find_element(By.CLASS_NAME,\\\"value\\\") 4、通过tag_name属

    2024年02月19日
    浏览(47)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包