js拿到元素的滚动值，js将元素滚动到可视范围

如何通过JS将滚动条移动到指定元素位置

使用`scrollTop`和`scrollLeft`属性 你可以通过改变`scrollTop`和`scrollLeft`属性来控制滚动条的位置。这两个属性分别控制垂直和水平的滚动位置。

通过div的scrollTop变动控制垂直 滚动条 位置。通过div的scrollLeft变动控制水平滚动条位置。

scrollTop属性只有DOM元素才有，window/document没有。用法1：获取值 var top = element.scrollTop；//返回数字，单位像素 用法2：设置值 element.scrollTop = 200；对上面的例子来说，控制滚动条的位置是wrap.scrollTop=xx；而不是inner.scrollTop，道理同上。

通过div的scrollTop变动控制垂直滚动条位置。\x0d\x0a通过div的scrollLeft变动控制水平滚动条位置。

我有个思路，就是不用这种方式，可以给点击的a标题一个id，然后在js中给这个id添加一个点击事件， 要跳转的目标位置可以用js去获取到，然后使用定时器来控制滚动条的位置。

相关问答

Q1: 如何用js或Jq获取DIV内元素相对于DIV元素滚动条顶部的距离?

1、打开sublime text3，也可以用其他编辑器，这里新建一个HTML文档作为示范。创建一下HTML文档的基本架构。设置多个标签，这样等会可以有更多选择。创建一个JS文档，并且与HTML文档关联。输入var test = document.getElementById( pp).offsetTop；document.write( test )。

2、首先在html页面上，看到有一个按钮，要获得这个按钮离顶部的距离。在按钮的事件函数里，先取这个按钮的offset数据，通过jquery的offset方法。得到的结果是一个数组对象，只要获取里面的top数据就行了。使用log方法，把数据输出到浏览器的控制台。运行页面，看到现在的按钮位置。

3、浏览器。首先，打开html编辑器，新建html文件，例如：index.html，并引入jquery。在index.html中的script标签，输入jquery代码：(body).append($(div).offset().top - $(window).scrollTop())；浏览器运行index.html页面，此时通过jquery获取到了页面div倒窗口顶部的距离。

Q2: 如何用JavaScript获取/计算页面元素的offset

通过四个属性可以获得元素的偏移量：offsetHeight： 元素在垂直方向上占用的空间的大小，（像素）。包括元素的高度，（可见的）水平滚动条的高度，上边框高度和下边框高度。offsetWidth：元素在水平方向上占用的空间的大小，（像素）。

就是获取当前元素的offsetTop值，减去可视区域的高度和窗口卷起的高度。

console.log(child.offsetLeft)； // 输出20 这个值表示child元素的左边界距离parent元素的左边界的距离是20px。

js拿到元素的滚动值的介绍就聊到这里吧，感谢你花时间阅读本站内容，更多关于js将元素滚动到可视范围、js拿到元素的滚动值的信息别忘了在本站进行查找喔。