瀏覽器滾動條操作_1.15

一、前言：

JS定義：

JS就是JavaScript；屬於web的語言，它適用於PC、筆記本電腦、平板電腦和移動電話

JavaScript被設計爲向HTML頁面增加交互性

JS傳送門：http://www.w3school.com.cn/b.asp

 

二、JS處理滾動條問題

1、滾動條回到頂部：

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

driver.execute_script(js）

或者

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

driver.execute_script(js)

 

2、滾動條拉到底部：

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

driver.execute_script(js)

或者

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

driver.execute_script(js)

 

3、滾動條拉到指定位置（具體元素）：

target = driver.find_element_by_id("id_keypair")

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

 

4、通過模擬鍵盤 DOWN（↓）來拖動：

driver.find_element_by_id("id").send_keys(Keys.DOWN)

 

5、scrollTo 函數用法

 

scrollHeight	獲取對象的滾動高度
scrollLeft	設置或獲取位於對象左邊界和窗口中目前可見內容的最左端之間的距離
scrollTop	設置或獲取位於對象最頂端和窗口中可見內容的最頂端之間的距離
scrollWidth	獲取對象的滾動寬度

滾動到底部：

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

driver.execute_script(js)

滾動到頂部：

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

driver.execute_script(js)

 

三、使用 JS 操作瀏覽器滾動條

（1）使用JS操作瀏覽器右側豎向滾動條

例子1：

from selenium import webdriver

from time import sleep

driver = webdriver.Firefox()

driver.get("http://www.51zxw.net")

#0是頂部，10000是底部

js = "var action=document.documentElement.scrollTop=10000" #將滾動條拖到最底部

driver.execute_script(js)

sleep(3)

js = "var action=document.documentElement.scrollTop=0" #將滾動條拖到最頂部

driver.execute_script(js)

sleep(3)

driver.quit()

print("拖動成功")

 

例子2：

from selenium import webdriver

import time

driver=webdriver.Firefox()

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

driver.find_element_by_id("kw").send_keys("selenium")

driver.find_element_by_id("su").click()

time.sleep(5)

#將頁面滾動條拖到最底端 var在json裏面定義一個變量

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

driver.execute_script(js)

time.sleep(5)

#將頁面滾動條拖到最頂端

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

driver.execute_script(js)

time.sleep(5)

#將頁面滾動條移動到頁面任意位置,改變等於號後的數值即可

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

driver.execute_script(js)

driver.quit()

 

例子3：

'''

#右側的滾動條上下拖動

from selenium import webdriver

import time

driver=webdriver.Firefox()

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

driver.find_element_by_id("kw").send_keys("selenium")

driver.find_element_by_id("su").click()

time.sleep(5)

#將頁面滾動條拖到最底端 var在json裏面定義一個變量

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

driver.execute_script(js)

time.sleep(5)

#將頁面滾動條拖到最頂端

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

driver.execute_script(js)

time.sleep(5)

#將頁面滾動條移動到頁面任意位置,改變等於號後的數值即可

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

driver.execute_script(js)

driver.quit()

 

'''

 

#瀏覽器底部的橫向滾動條

from selenium import webdriver

import time

driver=webdriver.Firefox()

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

driver.find_element_by_id("kw").send_keys("selenium")

driver.find_element_by_id("su").click()

js1 = "window.scrollTo(0, document.body.scrollHeight)"#滑動滾動條到底部

js2 = "window.scrollTo(0,0)"#滑動到頂部

js3 = "window.scrollTo(0,200)"#向下移動200像素

js4 = "arguments[0].scrollIntoView();"#滑動滾動條到某個指定的元素

time.sleep(2) #等待頁面加載完，注意觀察滾動條目前處於最上方

driver.execute_script(js1) #執行js1，將滾動條滑到最下方

time.sleep(2) #加等待時間，看效果

driver.execute_script(js2) #執行js2，將滾動條滑到最上方

time.sleep(2) #加等待時間，看效果

driver.execute_script(js3) #執行js3，將滾動條向下滑到200像素

time.sleep(2) #加等待時間，看效果

driver.execute_script(js2) #執行js2，將滾動條滑到最上方

time.sleep(2)

ele = driver.find_element_by_id('con-ar') #定位一個元素driver.execute_script(js4,ele) #滑動到上面定位的元素的地方

time.sleep(2)

 

（2）使用JS操作瀏覽器底部橫向滾動條

from selenium import webdriver

import time

driver=webdriver.Firefox()

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

time.sleep(2)

driver.find_element_by_id('kw').send_keys("selenium")

driver.find_element_by_id('su').click()

driver.set_window_size(500,500)

js1="window.scrollTo(document.body.scrollWidth,0)"

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

js3="window.scrollTo(200,0)"

driver.execute_script(js1) #移動到最右邊

time.sleep(2)

driver.execute_script(js2) #移動到最左邊

time.sleep(2)

driver.execute_script(js3) #向右移動200像素

time.sleep(2)

 

 

===========================================================

下面沒有深做研究

===========================================================

（3）滾動條拉到指定位置

若要對頁面中的提示警告窗口中的滾動條進行操作，要先定位到該內嵌窗口，在進行滾動條操作 js="var q=document.getElementById('id').scrollTop=100000"

driver.execute_script(js)

time.sleep(3)

 

使用js腳本拖動到提定地方

target = driver.find_element_by_id("id_keypair") driver.execute_script("arguments[0].scrollIntoView();", target) #拖動到可見的元素去

 

 

（4）通過模擬鍵盤操作

用鍵盤右下角的UP,DOWN按鍵來處理頁面滾動

from selenium import webdriver

import time

from selenium.webdriver.common.keys import Keys

#訪問百度

driver=webdriver.Firefox()

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

#搜索

driver.find_element_by_id("kw").send_keys("selenium")

driver.find_element_by_id("su").click()

time.sleep(3)

#通過按向下鍵將頁面滾動條拖到底部

driver.find_element_by_xpath("//*[@id='page']/a[10]").send_keys(Keys.DOWN)

print ('將滾動條拉到底端')

time.sleep(2)

driver.find_element_by_xpath("//*[@id='s_tab']/a[9]").send_keys(Keys.UP)

print ('將滾動條拉到上端')

time.sleep(2)

driver.quit()

 

根據頁面顯示進行變通，發送tab鍵

密碼是輸入框，正常手工操作時，可以通過tab鍵會切換到密碼框中，所以根據此思路，在python中也可以發送tab鍵來切換，使元素顯示

from selenium.webdriver.common.keys import Keys driver.find_element_by_id("id_login_method_0").send_keys(Keys.TAB)