python + selenium + chrome 如何操作滾動條

python + selenium + chrome 如何操作滾動條

1. 背景

• 在使用selenium模擬瀏覽器時，經常會需要下拉滾動條，一般是有兩個目的：
• 擬人操作，突破精妙的反爬系統。
• 有些元素正常情況下不加載出來，需要拖動下拉條，才能慢慢加載出來，類似於淘寶這樣的網站。

2. 環境

• python 3.6.1
• 系統：win7
• IDE：pycharm
• 安裝過chrome瀏覽器
• 配置好chromedriver
• selenium 3.7.0

3. 操作方法

3.1. 拖動到指定元素位置。

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
from selenium.webdriver.common.action_chains import ActionChains
from selenium.webdriver.common.keys import Keys
from selenium.webdriver.support.ui import Select

import time
import random

# 加載xpath插件
chrome_options = webdriver.ChromeOptions()
extension_path = 'D:/extension/XPath-Helper_v2.0.2.crx'
chrome_options.add_extension(extension_path)

browser = webdriver.Chrome(chrome_options=chrome_options)
#browser.maximize_window()
wait = WebDriverWait(browser, 25)
waitPopWindow = WebDriverWait(browser, 25)

browser.get("https://www.amazon.com/s/ref=nb_sb_noss_2?url=search-alias%3Daps&field-keywords=phone")

time.sleep(random.randrange(5, 10, 1))

# 找到 Next Page 按鈕， 屬於可見元素
# js代碼有兩種寫法，但是對元素的要求不同，focus更爲嚴格

# 第一種方法：focus
targetElem = browser.find_element_by_xpath("//a[@id='pagnNextLink']")
browser.execute_script("arguments[0].focus();", targetElem)

# 第二種方法：scrollIntoView
# targetElem = browser.find_element_by_xpath("//a[@id='pagnNextLink']/span[@id='pagnNextString']")
# browser.execute_script("arguments[0].scrollIntoView();", targetElem)    # 拖動到可見的元素去

print(f"結束拖動滾動條....")
time.sleep(random.randrange(5, 10, 1))
browser.quit()

3.2. 指定下拉距離

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
from selenium.webdriver.common.action_chains import ActionChains
from selenium.webdriver.common.keys import Keys
from selenium.webdriver.support.ui import Select

import time
import random

# 加載xpath插件
chrome_options = webdriver.ChromeOptions()
extension_path = 'D:/extension/XPath-Helper_v2.0.2.crx'
chrome_options.add_extension(extension_path)

browser = webdriver.Chrome(chrome_options=chrome_options)
browser.maximize_window()
wait = WebDriverWait(browser, 25)
waitPopWindow = WebDriverWait(browser, 25)

browser.get("https://www.amazon.com/s/ref=nb_sb_noss_2?url=search-alias%3Daps&field-keywords=phone")

time.sleep(random.randrange(5, 10, 1))
# 指定像素
jsCode = "var q=document.documentElement.scrollTop=100000"
browser.execute_script(jsCode)
print("拖動滑動條到底部...")

time.sleep(random.randrange(5, 10, 1))
browser.quit()

3.3. 發送tab鍵，移動到目標元素

• 可以發送tab鍵來切換頁面按鈕，達到下拉滾動條的目的。但是一定要注意的是，指定的元素一定要能被TAB鍵選中，像輸入框，超鏈接，Button等。

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
from selenium.webdriver.common.action_chains import ActionChains
from selenium.webdriver.common.keys import Keys
from selenium.webdriver.support.ui import Select

import time
import random

# 加載xpath插件
chrome_options = webdriver.ChromeOptions()
extension_path = 'D:/extension/XPath-Helper_v2.0.2.crx'
chrome_options.add_extension(extension_path)

browser = webdriver.Chrome(chrome_options=chrome_options)
browser.maximize_window()
wait = WebDriverWait(browser, 25)
waitPopWindow = WebDriverWait(browser, 25)

browser.get("https://www.amazon.com/s/ref=nb_sb_noss_2?url=search-alias%3Daps&field-keywords=phone")

time.sleep(random.randrange(5, 10, 1))

# 找到 Next Page 按鈕， 屬於可見元素

# 指定元素是 超鏈接 ———— 可以用Tab鍵切換到
targetElem = browser.find_element_by_xpath("//a[@id='pagnNextLink']")

# 這個元素不是超鏈接，所以無法接收Tab鍵
# targetElem = browser.find_element_by_xpath("//a[@id='pagnNextLink']/span[@id='pagnNextString']")

targetElem.send_keys(Keys.TAB)

print(f"結束拖動滾動條....")
time.sleep(random.randrange(5, 10, 1))
browser.quit()

3.4. 注意事項：

• 將頁面滾動條滑到底部
  self.driver.execute_script(“window.scrollTo(0,document.body.scrollHeight);”)

• 向下滑動滾動條，跳轉到目標元素處
  self.driver.execute_script(“arguments[0].scrollIntoView();”, el)

• 向上滑動滾動條，跳轉到目標元素處
  self.driver.execute_script(“arguments[0].scrollIntoView(false);”, el)

• arguments[0].scrollIntoView()，不能隨意使用,會先把元素element對象的表格“頂端”移動到與當前窗口的“頂部”對齊，如果元素當前可見，可能移動後就不可見了，導致定位報錯。因爲會把元素頂端對齊窗口頂部，有時候也會出現跳轉後，元素仍然不可見的情況。

• 如果是需要點擊這個元素，可以直接使用js驅動的方式（直接點擊不可見的目標元素，不再先跳轉），如下：
  self.driver.execute_script(“arguments[0].click();”, el)