1轿衔、為什么操作滾動(dòng)條
在HTML頁(yè)面中沉迹,由于前端技術(shù)框架的原因,頁(yè)面中的一些元素為動(dòng)態(tài)顯示害驹,元素根據(jù)滾動(dòng)條的下拉而被加載鞭呕。
例如:頁(yè)面注冊(cè)同意條款,需要滾動(dòng)條到最底層宛官,才能點(diǎn)擊同意葫松。
2、Selenium如何操作滾動(dòng)條
Selenium
的WebDriver
類(lèi)庫(kù)中并沒(méi)有直接提供對(duì)滾動(dòng)條進(jìn)行操作方法底洗,但是Selenium
提供了可調(diào)用JavaScript
腳本的方法腋么,所以我們可以通過(guò)JavaScript
腳本來(lái)達(dá)到操作滾動(dòng)條的目的。
提示:
- 滾動(dòng)條:一種可控制程序顯示范圍的組件亥揖。
- JavaScript:一種流行腳本語(yǔ)言珊擂,可以操作HTML標(biāo)簽。
JavaScript學(xué)習(xí)文檔:http://www.w3school.com.cn/js/js_intro.asp
3徐块、Selenium操作滾動(dòng)條方法
-
設(shè)置
JavaScritp
腳本控制滾動(dòng)條js="window.scrollTo(0,1000)
(0:水平距離未玻;1000:垂直距離;單位像素px)
-
WebDriver
調(diào)用JavaScritp
腳本方法driver.execute_script(js)
提示:
- 最頂層
js="window.scrollTo(0,0)"
- 最底層
js="window.scrollTo(0,1000)"
注:1000不代表一定到最底層胡控,要根據(jù)瀏覽器頁(yè)面的實(shí)際大小扳剿。
- 直接操作垂直距離的方式
js= "var q=document.documentElement.scrollTop=n
4、練習(xí)
需求:訪問(wèn)淘寶首頁(yè)昼激,在淘寶首頁(yè)實(shí)現(xiàn)Selenium對(duì)滾動(dòng)條的操作庇绽。
腳本代碼:
"""
1.學(xué)習(xí)目標(biāo):
掌握瀏覽器滾動(dòng)條的操作方法
2.語(yǔ)法
2.1使用js語(yǔ)言編寫(xiě)控制滾動(dòng)條代碼
參數(shù):
0,表示水平距離;
10000,表示垂直距離 單位:px
格式:
向下滾動(dòng):window.scrollTo(0,10000)
向上滾動(dòng):window.scrollTo(0,0)
2.2使用selenium中方法執(zhí)行js代碼
driver.execute_script(js代碼)
3.需求
在頁(yè)面中,控制滾動(dòng)條
4.總結(jié)
如果需要測(cè)試寫(xiě)的js代碼,可以在瀏覽器F12,控制臺(tái)console中執(zhí)行查看結(jié)果橙困。
"""
# 1.導(dǎo)入selenium
from selenium import webdriver
from time import sleep
# 2.打開(kāi)瀏覽器
driver = webdriver.Chrome()
# 3.打開(kāi)頁(yè)面
url = "https://www.taobao.com"
driver.get(url)
sleep(2)
# 4.滾動(dòng)條操作
# 4.1 滾動(dòng)條向下滾動(dòng)
js_down = "window.scrollTo(0,1000)"
# 執(zhí)行向下滾動(dòng)操作
driver.execute_script(js_down)
sleep(2)
# 4.2 滾動(dòng)條向上滾動(dòng)
js_up = "window.scrollTo(0,0)"
driver.execute_script(js_up)
sleep(2)
# 向下滾動(dòng)操作
# n為從頂部往下移動(dòng)滾動(dòng)距離
js1 = "var q=document.documentElement.scrollTop=2000"
driver.execute_script(js1)
sleep(2)
# 5.關(guān)閉瀏覽器
driver.quit()
5瞧掺、下拉至聚焦元素的位置
聚焦元素:就是把滾動(dòng)條滾動(dòng)到你想要查找的元素的位置
步驟:
# 1 定位需要聚焦元素
target = driver.find_element_xx
# 2 js代碼
js = "arguments[0].scrollIntoView()"
# 3 執(zhí)行聚焦元素操作
driver.execute_script(js代碼,元素target)
示例:
頁(yè)面代碼片段
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<style type="text/css">
button{padding: 8px; background: #f8f8f8;border-radius: 5px}
button{margin-left:200px;margin-top:2000px}
</style>
</head>
<body>
<button type="submitA" value="注冊(cè)A" title="加入會(huì)員A" >注冊(cè)用戶A</button>
</body>
</html>
腳本代碼:
"""
1.學(xué)習(xí)目標(biāo):
掌握聚焦元素的操作方法
2.語(yǔ)法(操作方法)
2.1 定位需要聚焦元素
target = driver.find_element_xx
2.2 js代碼
js = "arguments[0].scrollIntoView()"
2.3 執(zhí)行聚焦元素操作
driver.execute_script(js代碼,元素target)
3.需求
在頁(yè)面中,滾動(dòng)條下拉聚焦元素位置。
"""
# 1.導(dǎo)入selenium
from selenium import webdriver
from time import sleep
import os
# 2.打開(kāi)瀏覽器
driver = webdriver.Chrome()
# 3.打開(kāi)頁(yè)面
url = "file:///" + os.path.abspath("./1.html")
driver.get(url)
sleep(2)
# 4.滾動(dòng)條下拉聚焦元素位置
# 4.1 定位需要聚焦元素-淘寶首頁(yè)的END文字
element = driver.find_element_by_css_selector("[type='submitA']")
# 4.2 js代碼
js = "arguments[0].scrollIntoView()"
# 4.3 執(zhí)行聚焦元素操作
driver.execute_script(js, element)
sleep(3)
# 5.關(guān)閉瀏覽器
driver.quit()