当 javascript count++ 达到所选值时,如何跳转到页面顶部 [<div id="To"></div>]?

Posted

技术标签:

【中文标题】当 javascript count++ 达到所选值时,如何跳转到页面顶部 [<div id="To"></div>]?【英文标题】:How do I jump to the Page Top [<div id="Top"></div>] when a javascript int++ reaches a chosen value? 【发布时间】:2020-09-15 06:16:25 【问题描述】:

正如标题所说,当 javascript int++ 达到所选值时,如何跳转到页面顶部 ['div id ="Top" /div']?我不希望单击按钮来执行此操作。我需要在使用“可见性:可见性”显示文本 div 之前显示视觉背景幻灯片内容。那不是问题。问题是用鼠标涂鸦并移动当前的“可见性:隐藏;”在页面下方寻找它并在不知不觉中从即将到来的顶部介绍性文本中摆弄并移开文本。所以,按照我的 'document.getElementById("ArticleStyle").style.visibility = "visible";' 的 javascript 行我希望添加一行命令页面聚焦/导航回顶部,以便在文本设置为可见时强制从 'div id="Top" /div' 开始。

【问题讨论】:

【参考方案1】:

试试这个:

<button onclick="goToTop()"></button>
function goToTop() 
  document.body.scrollTop = 0;
  document.documentElement.scrollTop = 0;

【讨论】:

感谢您提供非常有效且知识渊博的解决方案。它只需要一行'document.documentElement.scrollTop = 0;'完全解决我的问题。【参考方案2】:

或者,您也可以将元素滚动到视图中。

var elmnt = document.getElementById("top");
elmnt.scrollIntoView();

【讨论】:

如果有效,您的答案会更加灵活,并且确实使用 id="Top" [顶部大写为我的代码的 Top] 通过灵活性,答案可以适用于任何其他位置,例如中间等。但是使用这两行代码,页面不会跳转到(“顶部”)位置。 'top' 元素是否已经在屏幕上可见? 我确定的最终解决方案基本上是你的。使用 w3c 示例,我必须将 (true) 放入空 ()。 (true) 导航/滚动到顶部和 (false)(如果使用)到底部。我仍然无法导航到给定的小 div id 标签 [例如 id="middle" 或 id="top"]。由于我不需要这种灵活性,我通过使用包含我所有文本的大包装 div 的 id 方便地解决了这个限制。使用的一个完全编码的行是: document.getElementById("DIV-MasterPoetryBlockDiv").scrollIntoView(true); 作为相关兴趣的注释和一个允许我在 html 页面上的任何位置导航的问题,这是我的工作解决方案。设置一个带有 id 的标记 div 以导航到: div id="anywherOne" /div 满足条件时[我的处于脚本“循环”中,使用 int++ 创建背景更改并使用“if”来评估我想要的时间导航到我的标记 div id anyWhereOne] 添加以下脚本行 window.location.assign("#anyWhereOne");

以上是关于当 javascript count++ 达到所选值时,如何跳转到页面顶部 [<div id="To"></div>]?的主要内容,如果未能解决你的问题,请参考以下文章

Javascript:显示所选图像[重复]

当数组达到特定长度时删除javascript数组的最后一个元素

VueJS - 我无法在达到所选限制数据之前或之后隐藏阅读更多按钮以在 vuejs 中显示

javascript 复制所选文本

JavaScript 复制所选文字

如何使用 javascript 在 getSelection() 中查找所选文本的索引?