web ui自动化之模拟页面滑动 - 使用js

---

前言

我们浏览web网站时，经常需要进行滑动页面操作。在Selenium自动化测试过程中，可以通过execute_script 执行js语句实现页面滑动。

常见的滑动场景分为四种：滑动至底部、滑动至顶部、滑动至具体位置、滑动至目标元素可见。

可以在浏览器–F12–切换到控制台，输入js代码，试验是否达到预期，在写进python代码中

---

一、滑动页面至目标可见

1.向下滑动至元素可见

代码如下（示例）：

element = driver.find_element(By.XPATH,'//h2[text()="央媒及业内"]')
driver.execute_script("arguments[0].scrollIntoView();", element)
time.sleep(3)

2.向上滑动至元素可见

代码如下（示例）：

# 滑动至目标可见--向上滑动至元素可见
element2 = driver.find_element(By.XPATH,'//h2[text()="一个平台 链接全球"]')
driver.execute_script("arguments[0].scrollIntoView(false);",element2)
time.sleep(3)

二、滑动页面至底部/顶部

1.滑动到页面底部

代码如下（示例）：

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

2.滑动到页面顶部

代码如下（示例）：

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

三、滑动页面指定位置

1.向下滑动指定像素

代码如下（示例）：

# 向下滑动1000像素
window.scrollBy(0,1000)

2.向上滑动指定像素

代码如下（示例）：

# 向上滑动500像素
driver.execute_script("window.scrollBy(0, -500)")

3.向右滑动指定像素

代码如下（示例）：

driver.execute_script("window.scrollBy(500, 0)")

4.向左滑动指定像素

代码如下（示例）：

driver.execute_script("window.scrollBy(-500, 0)")

5.设置浏览器窗口滚动条的位置

代码如下（示例）：

window.scrollTo(200,500); # 200为x轴，500为y轴；将窗口缩小一些即可验证