Javascript js或Jquery-获取可滚动div的可视区域

我当前有一个动态填充的可滚动div。
我有一个函数，可以捕获向上箭头和向下箭头键，并更改父div中的类，以便一次选择一个子类 （基本上这模拟了选择输入）

以下是我想做的： 我需要更改div的可视区域（向下或向上），以显示最近“选定”的子对象，但前提是该子对象不在父对象的可视区域中

因此，我需要以某种方式获得与父div的滚动高度相关的可视区域…但我不确定如何做到这一点

此外，我不知道如何设置父div的可视区域

---

任何帮助都将不胜感激

如果使用jQuery，可以使用

position（）

获取元素相对于其定位父元素的位置。可滚动div可设置为相对/绝对定位，以使其定位

---

此外，您还可以更改属性以更改滚动位置。或者jquery

scrollTop（pos）

您需要获取内部div的scrollTop，将outter div的高度添加到该值，这将为您提供可查看的尺寸

首先，我通过

var viewableTop = $("#parentDiv").scrollTop;
var viewableBottom = $("#parentDiv").innerHeight() + $("#parentDiv").scrollTop;

因此，可视顶部和可视底部之间的任何内容都是可视的。但你真的不需要知道这些。相反，你需要知道以下几点

//getting child position within the parent
var childPos = $("#childDiv").position().top;
//getting difference between the childs top and parents viewable area
var yDiff = ($("#childDiv").position().top + $("#childDiv").outerHeight()) - $("#parentDiv").innerHeight()

然后

//如果向上箭头和childPosition位于可视区域上方（这就是为什么它变为负数）
如果（event.keyCode==38&&childPos<0）
$（“#parentDiv”）.scrollTop+=childPos//将负数添加到滚动顶部
//如果向下箭头，则childs top和parents可视区域之间的差异大于childDiv的高度
else if（event.keyCode==40&&yDiff>$（“#childDiv”）.outerHeight（）-1）
$（“#parentDiv”）.scrollTop+=yDiff//将差异添加到顶部

谢谢，是的，最后我自己想出来了，就这么做了。我发布了我自己的答案哈哈。我最初尝试过这个，但它不起作用…然后在尝试了一个小时的其他事情后，我回到它，让一位同事看了看。。。他只是简单地指出“scrollTop”并不是拼写为“srollTop”哈哈，哦，简单的错误……然后我就想用我的头撞我的桌子，因为一些琐碎的事情

//if upArrow and childPosition is above viewable area (that's why it goes negative)
if(event.keyCode == 38 && childPos < 0)
    $("#parentDiv").scrollTop += childPos;//add the negative number to the scrollTop
//if downArrow and the difference between childs top and parents viewable area is greater than the height of a childDiv
else if(event.keyCode == 40 && yDiff > $("#childDiv").outerHeight()-1)
    $("#parentDiv").scrollTop += yDiff;//add the difference to the parents scrollTop