如何在不改变页面散列的情况下使用javascript导航到页面中的元素

Question

我需要导航到单元'divElem1'，单击按钮。可能吗？ 如果我们在浏览器中输入此链接，http://myUrl#divElem1，浏览器将导航到页面和DIV元素'divElem1'。同样的行为必须通过JavaScript获得。

散列更改不会在我的应用程序中工作，因为还有其他事件将在散列更改中被触发。 所以，以下将无法正常工作。

document.button.onclick = function() { 
    location.hash = "#divElem1"; 
}; 

document.getElementById("divElem1").focus()也没有工作，因为该元素是一个div

Answer 1

如果你想要“普通”的Javascript，请使用scrollIntoView()。但它真的跳到那个位置，参见this question and answer。

使用jQuery，它可以完成jumpy或与一些宽松，如解释here。

宽松建议提供更好的用户体验，并让访问者看到并理解正在发生的事情。

Answer 2

您可以使用scrollIntoView为：

document.getElementById("divElem1").scrollIntoView() 

这并没有给过到底在哪目标元素细粒度控制将最终结束，但它将被移入视图端口。更重要的是，如果该元素位于可滚动容器内，则容器和其内部的元素都将移动到某个位置，以便它们在视图端口中可见。