js中scrollIntoView()的用法

一. 什麼是scrollIntoView

scrollIntoView是一個與頁面(容器)滾動相關的API

二. 如何調用

element.scrollIntoView()  參數默認爲true

參數爲true：調用該函數，頁面發送滾動，使element的頂部與視圖(容器)頂部對齊

參數爲false：使element的底部與視圖(容器)底部對齊

三. 使用場景

在selenium+webdriver(python語言)作元素定位時，有的元素在頁面的不可見區域，這時候須要scrollIntoView()將其拖動到可見區域，代碼以下：

from selenium import webdriver #初始化chromedriver
driver = webdriver.Chrome() #設置隱性等待時間8s
driver.implicitly_wait(8) #打開百度首頁
driver.get("https://www.baidu.com/") #窗口最大化
driver.maximize_window() #使用xpath定位輸入框，並輸入內容 python
driver.find_element_by_xpath("//input[@id='kw']").send_keys("selenium") #定位並點擊 百度一下 的提交按鈕
driver.find_element_by_xpath("//input[@id='su']").click() #經過CSS定位到第10條搜索結果
target = driver.find_element_by_css_selector("div[id='10'] h3 a") #利用js將定位到的元素拖動到可見區域
driver.execute_script("arguments[0].scrollIntoView();", target) 

看到的狀況是，我定位到的元素的標題和瀏覽器頂部對齊了，效果不太好

這時只要把scrollIntoView()改爲scrollIntoView(false)就能夠解決了

#利用js將定位到的元素拖動到可見區域
driver.execute_script("arguments[0].scrollIntoView(false);", target)

 

 

 

參考文章

https://blog.csdn.net/hyl94/article/details/77472154

https://www.cnblogs.com/laoniaofly/p/5954202.html