天天看點

Selenium2+python自動化17-JS處理滾動條

前言

    selenium并不是萬能的,有時候頁面上操作無法實作的,這時候就需要借助JS來完成了。

常見場景:

當頁面上的元素超過一屏後,想操作螢幕下方的元素,是不能直接定位到,會報元素不可見的。

這時候需要借助滾動條來拖動螢幕,使被操作的元素顯示在目前的螢幕上。

滾動條是無法直接用定位工具來定位的。selenium裡面也沒有直接的方法去控制滾動條,

這時候隻能借助J了,還好selenium提供了一個操作js的方法:

execute_script(),可以直接執行js的腳本。

一、JavaScript簡介

1.JavaScript是世界上最流行的腳本語言,因為你在電腦、手機、平闆上浏覽的所有的網頁,

以及無數基于HTML5的手機App,互動邏輯都是由JavaScript驅動的。簡單地說,

JavaScript是一種運作在浏覽器中的解釋型的程式設計語言。

那麼問題來了,為什麼我們要學JavaScript?

2.有些特殊的操作selenium2+python無法直接完成的,JS剛好是這方面的強項,是以算是一個很

好的補充。對js不太熟悉的,可以網上找下教程,簡單了解些即可。

http://www.w3school.com.cn/js/index.asp4

Selenium2+python自動化17-JS處理滾動條

二、控制滾動條高度

1.滾動條回到頂部:

js="var q=document.getElementById('id').scrollTop=0"

driver.execute_script(js)

2.滾動條拉到底部

js="var q=document.documentElement.scrollTop=10000"

driver.execute_script(js)

3.這裡可以修改scrollTop 的值,來定位右側滾動條的位置,0是最上面,10000是最底部。

版權所有,微信公衆号:yoyoketang

三、橫向滾動條

1.有時候浏覽器頁面需要左右滾動(一般螢幕最大化後,左右滾動的情況已經很少見了)。

2.通過左邊控制橫向和縱向滾動條scrollTo(x, y)js = "window.scrollTo(100,400);"

3.第一個參數x是橫向距離,第二個參數y是縱向距離

Selenium2+python自動化17-JS處理滾動條

四、Chrome浏覽器

1.以上方法在Firefox上是可以的,但是用Chrome浏覽器,發現不管用。

谷歌浏覽器就是這麼任性,不聽話,于是用以下方法解決谷歌浏覽器滾動條的問題。

2.Chrome浏覽器解決辦法:

js = "var q=document.body.scrollTop=0"

五、元素聚焦

1.雖然用上面的方法可以解決拖動滾動條的位置問題,但是有時候無法确定我需要操作的元素

在什麼位置,有可能每次打開的頁面不一樣,元素所在的位置也不一樣,怎麼辦呢?

2.這個時候我們可以先讓頁面直接跳到元素出現的位置,然後就可以操作了。同樣需要借助JS去實作。

3.元素聚焦:

target = driver.find_element_by_xxxx()

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

六、擷取浏覽器名稱:driver.name

1.為了解決不同浏覽器操作方法不一樣的問題,可以寫個函數去做相容。

2.先用driver.name擷取浏覽器名稱,然後用if語句做個判斷

Selenium2+python自動化17-JS處理滾動條

七、相容性

1.相容谷歌和firefox/IE

Selenium2+python自動化17-JS處理滾動條

八、scrollTo函數

樓下有個小夥伴說這個scrollTo函數不存在相容性問題,小編借花獻佛了。

--scrollHeight 擷取對象的滾動高度。 

--scrollLeft 設定或擷取位于對象左邊界和視窗中目前可見内容的最左端之間的距離。 

--scrollTop 設定或擷取位于對象最頂端和視窗中可見内容的最頂端之間的距離。 

--scrollWidth 擷取對象的滾動寬度。

scrollTo函數不存在相容性問題,直接用這個函數就可以了

#滾動到底部

js = "window.scrollTo(0,document.body.scrollHeight)"

#滾動到頂部

js = "window.scrollTo(0,0)"

九、參考代碼如下:

# coding:utf-8

from selenium import webdriver

driver = webdriver.Firefox()

driver.get("https://www.baidu.com")

print driver.name

## 回到頂部

#def scroll_top():

#     if driver.name == "chrome":

#        js = "var q=document.body.scrollTop=0"

#     else:

#         js = "var q=document.documentElement.scrollTop=0"

#     return driver.execute_script(js)

# 拉到底部

#def scroll_foot():

#    if driver.name == "chrome":

#         js = "var q=document.body.scrollTop=10000"

#         js = "var q=document.documentElement.scrollTop=10000"

# 聚焦元素

JS功能還是很強大的,它還可以處理富文本、内嵌滾動條的問題,下次有空了再整理下。

在學習過程中有遇到疑問的,可以加selenium(python+java) QQ群交流:646645429

《selenium+python進階教程》已出書:selenium webdriver基于Python源碼案例

(購買此書送對應PDF版本)

繼續閱讀