selenium 常见操作,js操作-将元素滚动到页面可见区域

  我们在自动化测试中,会遇到需要把浏览器页面的元素移动到可见区域,就需要使用页面向上或者向下滚动

js操作-滚动条:使用: selenium 当中使用 execute_script   (译:埃克斯Q特。思怪泼特) 方法 执行 js 语句;

页面元素滚动到可见区域常用的操作:

1、移动到元素element对象的“底端”与当前窗口的“底部”对齐:

  • driver.execute_script("arguments[0].scrollIntoView(false);",element)

2、移动到元素element对象的“顶端”与当前窗口的“顶部”对齐 :

  • driver.execute_script("arguments[0].scrollIntoView();",element)

3、移动到页面底部:

  • driver.execute_script("window.scrollTo(0,document.body.scrollHeight)")

4、移动到页面顶部:

  • driver.execute_script("window.scrollTo(document.body.scrollHeight,0)")

将元素滚动到可见区域 :百度查询“电脑”,将“电脑_百度百科”移动到底部。

1、需要滚动的对象:先定位元素

2、js的滚动语句:上面的四种方法

from selenium import webdriver
from selenium.webdriver.support.wait import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
from selenium.webdriver.common.by import By
from selenium.webdriver.common.keys import Keys
import time

driver = webdriver.Chrome()
driver.get("http://www.baidu.com")

driver.find_element_by_id("kw").send_keys("电脑", Keys.ENTER)
# driver.find_element_by_id("su").click()

# 1、找到我要滚动到可见区域的元素
loc = (By.XPATH, ‘//a[text()="_百度百科"]‘)
WebDriverWait(driver, 20).until(EC.visibility_of_element_located(loc))
element = driver.find_element(*loc)

# 2、执行js的函数将元素滚动到可见区域:execute_script(译:埃克斯Q特。思怪泼特)
driver.execute_script("arguments[0].scrollIntoView(false);", element)  # 因顶部有遮罩层,所以与可见区域的底部对齐。
# 执行js的函数,如果是两个参数
# driver.execute_script("arguments[0].scrollIntoView(false);alert(arguments[1])", element, "200")

# 滚动到可见区域后,进行点击操作
element.click()
# 等待五秒,查看效果,关闭浏览器
time.sleep(5)
driver.quit()

*******请大家尊重原创,如要转载,请注明出处:转载自:https://www.cnblogs.com/shouhu/,谢谢!!*******

原文地址:https://www.cnblogs.com/shouhu/p/12227216.html

时间: 2024-07-31 08:45:54

selenium 常见操作,js操作-将元素滚动到页面可见区域的相关文章

java selenium webdriver处理JS操作窗口滚动条

未经作者允许,禁止转载!!! import org.openqa.selenium.JavascriptExecutor; import org.openqa.selenium.WebDriver; import org.openqa.selenium.chrome.ChromeDriver; public class JS20161212 { public static void main(String[] args) throws InterruptedException { // TODO

使用velocity.js制作炫酷滚动效果页面

Velocity.js是一款动画切换的jQuery插件,它重新实现了jQuery的$.animate()方法从而加快动画切换的速度.Velocity.js只有7k的大小,它不仅包含了$.animate()的所有功能,并且还包含了颜色切换.转换(transform).循环.缓动.CSS切换.Scroll功能,它是jQuery. jQuery UI.CSS变换 在动画方面的最佳组合. 课程链接:http://www.gbtags.com/gb/gbliblist/127.htm

selenium 常见元素操作:三大等待

selenium 常见元素操作 三大等待 三大切换(iframe,window,alert) 下拉列表 鼠标和键盘 js+ dom应用() 上传操作 强制等待:time.sleep()        (译:私立破) 必须等待固定时间后才可以往下运行 from selenium import webdriver import time # 强制等待需要导入time,使用其中的sleep方法 # 强制等待 sleep(译:私立破) # 打开谷歌浏览器,建立会话.启动Chromedriver.exe

selenium 常见操作,使用 js 操作-日期框及文本框

在使用 selenium 对页面进行相关操作时,有时候会遇到以下三种情况: 1.日期框:无法直接输入文本,必须要选择某一天的日期并点击才会填入文本框; 2.检索框:可以直接输入文本,但必须要点击根据输入的文本检索出来的下拉列表的某-项; 3.置灰的文本框:无法直接输入文本 按照常规套路,我们通常都会采取各种元素定位方法按照操作步骤一步步来实现 ,但是遇到上面三种奇葩,页面定位操作就显得有些捉襟见肘了,因此我们可以通过 selenium 中的 javascript 操作来处理它. 我们以12306

selenium+常见操作

1.多窗口操作 有些页面的链接打开后,会重新打开一个窗口,对于这种情况,想在新页面上操作,就得先切换窗口了.获取窗口的唯一标识用句柄表示,所以只需要切换句柄,我们就能在多个页面上灵活自如的操作了. 句柄(handle):识别浏览器窗口的属性 获取当前窗口的句柄:driver.current_window_handle 获取当前所以的句柄:driver.current_window_handles 切换窗口:switch_to.window(all_h[1])(其中all_h[1]为需要访问窗口的

VBS操作JS网页元素实例

'=========================================================================='' VBScript Source File -- Created with SAPIEN Technologies PrimalScript 4.0'' NAME: '' AUTHOR: Microsoft , Microsoft' DATE : 2014/8/14'' COMMENT: ''==========================

js操作元素的样式

1.元素.style.属性='属性值' var div=document.getElementById('box') div.style.width='300px'; div.style.height='300px'; div.style.backgroundColor='red'; //css中有-的属性,在js中要改成驼峰命名法 2.div.style.属性     获取元素的样式 var div=document.getElementById('box') console.log(div.

web自动化 -- js操作(滑动屏幕、修改页面)

一.selenium对  js  的操作方法 1.先定义  js 操作   或者  定义  目标元素 2.执行  js  操作:  driver.execute_script(js操作)    或者  driver.execute_script("js操作的固定写法", 目标元素) 二.  js 操作 可以在浏览器F12的  console 进行演示 三.移动屏幕至目标元素 from selenium import webdriver driver = webdriver.Chrome

JS 操作Dom节点之样式

为了提高用户体验,我们经常会动态修改Dom节点的样式,各种浏览器差异比较大,我们如何应对?不断尝试,不断总结~! 1. style.getComputedStyle.currentStyle 内嵌样式: <!--body --><div style="width: 30px;background-color: #ff6a00;">我就是傻里傻气的,完全素颜!</div> 1 //内联样式优先级最高,通过style获取的样式是最准确的 2 var el