我想我有一个开始。当你考虑这个问题时，你会想到让子div进入父div的可视区域。一种简单的方法是使用页面上的子位置相对于父位置在页面上的位置。然后考虑到滚动的父。这里有一个可能的实现。

function scrollParentToChild(parent, child) {

  // Where is the parent on page
  var parentRect = parent.getBoundingClientRect();
  // What can you see?
  var parentViewableArea = {
    height: parent.clientHeight,
    width: parent.clientWidth
  };

  // Where is the child
  var childRect = child.getBoundingClientRect();
  // Is the child viewable?
  var isViewable = (childRect.top >= parentRect.top) && (childRect.bottom <= parentRect.top + parentViewableArea.height);

  // if you can't see the child try to scroll parent
  if (!isViewable) {
        // Should we scroll using top or bottom? Find the smaller ABS adjustment
        const scrollTop = childRect.top - parentRect.top;
        const scrollBot = childRect.bottom - parentRect.bottom;
        if (Math.abs(scrollTop) < Math.abs(scrollBot)) {
            // we're near the top of the list
            parent.scrollTop += scrollTop;
        } else {
            // we're near the bottom of the list
            parent.scrollTop += scrollBot;
        }
  }

}

只需要像这样传递父节点和子节点：

scrollParentToChild(parentElement, childElement)

添加了一个在主元素甚至嵌套元素上使用此函数的演示
https://jsfiddle.net/nex1oa9a/1/

这个功能可以在几个步骤中实现。首先，使用childElement.getBoundingClientRect();获取子节点的位置，它将返回以下值

bottom : val
height: val
left: val
right: val
top: val
width: val

然后根据左上角的值将子元素放置到父元素中，保持子元素position为absolute。父元素的position必须是relative类型，才能正确放置子元素并获得ScrollIntoView的效果。

childElement.style.position = 'absolute';
childElement.style.top = 'value in px';
childElement.style.left = 'value in px';

你可以做一些简单的事情，比如：

function customScroll(id) {
    window.location.href = "#mydiv"+id;
}

基本上window.location.href应该可以帮助你。

试试这个，我觉得很好用。

onArrowUp() {
    this.focus === null ? this.focus = 0 : (this.focus > 0 ? this.focus-- : null);
    this.items[this.focus].scrollIntoView({block: "nearest", behavior: "smooth"})
}

onArrowDown() {
    this.focus === null ? this.focus = 0 : (this.focus < this.items.length - 1 ? this.focus++ : null);        
    this.items[this.focus].scrollIntoView({block: "nearest", behavior: "smooth"})
}

方法onListUp和onListDown应在按下向上和向下箭头时调用。focus是元素数组的当前元素id。items是列表DOM元素的数组。