13.Selenium【鼠标和键盘操作】模拟鼠标操作页面元素（了解）

一、前言

actionchains是selenium里面专门处理鼠标和键盘相关的操作如：鼠标移动，鼠标按钮操作，按键和上下文菜单（鼠标右键）交互。这对于做更复杂的动作非常有用，比如悬停和拖放。actionchains也可以和快捷键结合起来使用，如ctrl,shif,alt结合鼠标一起使用

二、学习目标

1.鼠标点击

2.鼠标拖拽

3.鼠标悬停

三、知识点

首先需要了解ActionChains的执行原理，当你调用ActionChains的方法时，不会立即执行，而是会将所有的操作按顺序存放在一个队列里，当你调用perform()方法时，队列中的时间会依次执行。

ActionChains方法列表:

click(on_element=None) ——单击鼠标左键

click_and_hold(on_element=None) ——点击鼠标左键，不松开

context_click(on_element=None) ——点击鼠标右键

double_click(on_element=None) ——双击鼠标左键

drag_and_drop(source, target) ——拖拽到某个元素然后松开

drag_and_drop_by_offset(source, xoffset, yoffset) ——拖拽到某个坐标然后松开

key_down(value, element=None) ——按下某个键盘上的键

key_up(value, element=None) ——松开某个键

move_by_offset(xoffset, yoffset) ——鼠标从当前位置移动到某个坐标

move_to_element(to_element) ——鼠标移动到某个元素

move_to_element_with_offset(to_element, xoffset, yoffset) ——移动到距某个元素（左上角坐标）多少距离的位置

perform() ——执行链中的所有动作

release(on_element=None) ——在某个元素位置松开鼠标左键

send_keys(*keys_to_send) ——发送某个键到当前焦点的元素

send_keys_to_element(element, *keys_to_send) ——发送某个键到指定元素

1.【鼠标点击】

示例地址：http://sahitest.com/demo/clicks.htm

• 语法：

  ActionChains(driver).click(click_btn).perform()               # 单击按钮
  ActionChains(driver).double_click(doubleclick_btn).perform()  # 双击按钮
  ActionChains(driver).context_click(rightclick_btn).perform()  # 右键单击按钮
  

• 参数：

  传入元素对象

• 返回值：

  无

• 代码示例：

  # 导入webdriver
  from selenium import webdriver
  from selenium.webdriver import ActionChains
  # 创建一个浏览器对象
  driver = webdriver.Chrome(executable_path='./chromedriver.exe')
  #打开网页地址
  driver.get('http://sahitest.com/demo/clicks.htm')
  
  #1.鼠标点击
  click_btn = driver.find_element_by_xpath('//input[@value="click me"]')  # 单击按钮
  doubleclick_btn = driver.find_element_by_xpath('//input[@value="dbl click me"]')  # 双击按钮
  rightclick_btn = driver.find_element_by_xpath('//input[@value="right click me"]')  # 右键单击按钮
  
  ActionChains(driver).click(click_btn).double_click(doubleclick_btn).context_click(rightclick_btn).perform()  # 链式用法
  

2.【鼠标拖拽】

示例地址：http://sahitest.com/demo/dragDropMooTools.htm

• 语法：

  ActionChains(driver).drag_and_drop(起点元素, 终点元素).perform()                         #鼠标拖住到元素位置
  ActionChains(driver).drag_and_drop_by_offset(起点元素, 终点x坐标, 终点y坐标).perform()     #鼠标拖住到坐标位置
  ActionChains(driver).click_and_hold(起点元素).release(终点元素).perform()                #按住+松开实现拖拽
  

• 参数：

  传入元素对象

• 返回值：

  无

• 代码示例：

  # 导入webdriver
  import time
  from selenium import webdriver
  from selenium.webdriver import ActionChains
  # 创建一个浏览器对象
  driver = webdriver.Chrome(executable_path='./chromedriver.exe')
  #打开网页地址
  driver.get('http://sahitest.com/demo/dragDropMooTools.htm')
  
  dragger = driver.find_element_by_id('dragger')  # 被拖拽元素
  item1 = driver.find_element_by_xpath('//div[text()="Item 1"]')  # 目标元素1
  item2 = driver.find_element_by_xpath('//div[text()="Item 2"]')  # 目标2
  item3 = driver.find_element_by_xpath('//div[text()="Item 3"]')  # 目标3
  item4 = driver.find_element_by_xpath('//div[text()="Item 4"]')  # 目标4
  
  action = ActionChains(driver)
  action.drag_and_drop(dragger, item1).perform()  # 1.移动dragger到目标1
  action.drag_and_drop_by_offset(dragger, 400, 150).perform()  # 2.移动到指定坐标
  
  time.sleep(2)
  action.click_and_hold(dragger).release(item2).perform()  # 3.鼠标按住，并在item2元素释放
  

3.【鼠标悬停】

示例地址：http://sahitest.com/demo/mouseover.htm

• 语法：

  ActionChains(driver).move_to_element(目标元素).perform()                        #鼠标悬停到元素上
  ActionChains(driver).move_by_offset(10, 60).perform()                         #鼠标悬停到距离当前位置的坐标点上（了解）
  ActionChains(driver).move_to_element_with_offset(目标元素, 10, -40).perform()   #鼠标悬停到距离指定元素位置的相对坐标点上（了解）
  

• 参数：

  传入元素对象

• 返回值：

  无

• 代码示例：

  # 导入webdriver
  import time
  from selenium import webdriver
  from selenium.webdriver import ActionChains
  # 创建一个浏览器对象
  driver = webdriver.Chrome(executable_path='./chromedriver.exe')
  #打开网页地址
  driver.maximize_window()
  driver.get('http://sahitest.com/demo/mouseover.htm')
  
  write = driver.find_element_by_xpath('//input[@value="Write on hover"]')  # 鼠标移动到此元素，在下面的input框中会显示“Mouse moved”
  blank = driver.find_element_by_xpath('//input[@value="Blank on hover"]')  # 鼠标移动到此元素，会清空下面input框中的内容
  
  action = ActionChains(driver)
  action.move_to_element(write).perform()  #鼠标悬停到元素上
  #action.move_by_offset(10, 60).perform()  #鼠标悬停到距离当前位置的坐标点上
  #action.move_to_element_with_offset(blank, 10, -40).perform()  #鼠标悬停到距离指定元素位置的相对坐标点上