js横向滚动_seleniumJS处理滚动条

前言　　

在web自动化中，会遇到想要定位的内容，由于电脑分辨率的问题导致，需要定位的元素可能没有在页面上展示出来，这个时候我们应该怎么做呢？正常情况下，肯定是点击滚动条，找到想要的元素，然后进行操作。问题来了，selenium有没有办法操作滚动呢？selenium目前没有好的办法进行操作滑动条，但是前面介绍的JS有这个功能哈

滚动条

滚动条：滚动条是在我们使用软件无法显示整个界面的时候，右侧的一个可以滚动的用于显示剩下界面的条知道了滚动条是什么，那么我们如何通过JS进行操作呢？

JS操作滚动条

JS操作滚动条有几种

1、滚动条到顶部

# JS滚动条到顶部js="var q=document.getElementById('id').scrollTop=0"

2、滚动条在底部，scrollTop表示滑动条的位置

# 滚动条到底部，js="var q=document.documentElement.scrollTop=10000"

3、操作横向滚动条

# 操作横向滚动条js  = “window.scrollTo(100,400)“

4、通过元素进行滚动

通过观察会发现上面的滚动条都是滚动到固定位置，那么我们的元素在中间，我们又不清楚滚动条具体停放在哪里？我们可以通过JS进行找到这个元素然后将滚动条操作到可见元素的位置

# 滚动到元素可见位置js = "arguments[0].scrollIntoView()"# 元素位置element = driver.find_element_by_id('xxxx')# 滚动可见位置driver.execute_script(js,element)

小试牛刀

这里安静就拿博客园来举例子，通过元素进行滚动到可视区域

from selenium import webdriverimport timedriver = webdriver.Chrome()driver.get('https://www.cnblogs.com/qican/')# 找到想要滚动到的元素element = driver.find_element_by_xpath('//*[contains(text(),"下一页")]')# js操作脚本js = "arguments[0].scrollIntoView()"driver.execute_script(js,element)time.sleep(2)element.click()

其实通过JS操作web页面的内容还有很多，JS可以帮助我们解决一些selenium无法解决的问题，后续一点点的为大家补充JS工作中遇到的内容，

js横向滚动_seleniumJS处理滚动条相关推荐

2 行 JS 代码实现页面横向滚动特效
在前端这个无奇不有的世界里,有些网站不是正常垂直滚动的,而是横向滚动的: 那么在没法把鼠标滚轮横过来的前提下(苹果除外),能否实现网页横向滚动呢?我们来写代码试试.先看一下最终效果,这里我用鼠标的滚轮 ...
php中表头不跟着滑动,JS实现table表格固定表头且表头随横向滚动而滚动
这篇文章主要介绍了JS实现table表格固定表头且表头可以随横向滚动而滚动,对js的朋友可以参考下本篇文章先看一张效果图思路: 1.头部用一个table并用一个p包裹着, 表格的具体内容用一个ta ...
html页面加文字横向滚动,js实现文字横向滚动
页面布局恭喜793765***获得 50元巨人点卡奖励恭喜793765***获得 50元巨人点卡奖励恭喜793765***获得 50元巨人点卡奖励恭喜793765***获得 50元巨人点卡奖励 ...
html禁止页面左右滑动,js阻止移动端默认事件以及只阻止横向滚动事件方法
js阻止移动端默认事件,是在相关的touch事件的时候利用event.preventDefault();来阻止默认滚动行为,但是如果要实现阻止横向滚动行为而不阻止竖向滚动行为就要写一个方法通过手指滑动 ...
html 图片自动滚动播放,JS实现图片自动滚动(图片横向滚动)
实带道术用量确示常构端析以要效开的用,近不现的效果就是一排图片自动横向滚动,鼠标指向的时候,暂定滚动,鼠标离开,继续滚要圈器是天的年编功小还久概据含直这请框结业未商屏页屏随会维气大机域页效实一应控高 ...
原生JS实现公告栏文字横向滚动(通告栏)
在做APP公告滚动的时候用到,感觉还不错,码了转载地址:https://blog.csdn.net/zhangzeshan/article/details/83588979#commentsedit ...
用css、js实现字幕横向滚动
最近,在写电子房价牌页面时,关于电子房价的提示,需要用到横向滚动字幕的效果,本文用的是jquery.js的方法来实现的.在网上查阅资料的时候,发现以前会使用<marque>的html标签来 ...
html公告栏设计,原生JS实现公告栏文字横向滚动(通告栏)
在做APP公告滚动的时候用到,感觉还不错,码了转载地址:https://blog.csdn.net/zhangzeshan/article/details/83588979#commentsedit ...
js实现文字横向滚动与纵向滚动(支持手动滑动距离)
js实现横向滚动 1.布局 <div id="scroll_div" class="fl"> <div id="scroll_beg ...