我无法理解它。
该元素存在于多个可滚动 DIV 元素的嵌套层次结构中，而不是存在于单个可滚动文档窗口中。
我头疼的问题之一是scrolled.offsetParent是document.body(下面测试代码中的颜色papayawhip)而不是可滚动(颜色粉色)。
基于 JQuery 和其他库的此问题的解决方案仅作为补充是可以接受的——为了其他用户的利益，而不是我的利益。
测试代码
(原文地址:JSFiddle .)
function ReportExpression(ExpressionString) {
return ExpressionString + " == " + eval(ExpressionString) + "\n";
}
function ButtonClick() {
var scrollable = document.querySelector('#scrollable');
var scrolled = document.querySelector('#scrolled');
alert(
ReportExpression("scrollable.scrollTop") +
ReportExpression("scrolled.offsetTop") +
ReportExpression("(scrolled.offsetParent == document.body)")
);
scrollable.scrollTop = scrolled.offsetTop;
}html {background-color: white;}
body {text-align: center; background-color: papayawhip;}
#page {display: inline-block; text-align: left; width: 500px; height: 500px;
overflow: auto; background-color: powderblue; padding: 10px;}
#scrollable {height: 500px; overflow: auto; background-color: pink;}<body>
<div id="page">
<button onClick="ButtonClick();">Scroll</button>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<div id="scrollable">
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<text id="scrolled">I want to scroll all scrollbars to this element.</text>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
</div>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
</div>
</body>我研究过的文章
最佳答案
this怎么样？ ？:
function ButtonClick() {
var page = document.querySelector('#page');
var scrollable = document.querySelector('#scrollable');
var scrolled = document.querySelector('#scrolled');
page.scrollTop = scrollable.offsetTop-page.offsetTop;
scrollable.scrollTop = scrolled.offsetTop-scrollable.offsetTop;
}
关于javascript - 滚动所有嵌套的滚动条以将 HTML 元素带入 View ，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37137450/