怎么在html中跳转到指定位置
导读:本文共925.5字符,通常情况下阅读需要3分钟。同时您也可以点击右侧朗读,来听本文内容。按键盘←(左) →(右) 方向键可以翻页。
摘要: 纯html实现跳转时机:<a href="#anchorName">点击跳转到name为anchorName的位置</a>埋锚点:<a name="anchorName">a标签的锚点</a>,<p id="anchorName">以id为标记... ...
目录
(为您整理了一些要点),点击可以直达。纯html实现
跳转时机:<a href="#anchorName">点击跳转到name为anchorName的位置</a>
埋锚点:<a name="anchorName">a标签的锚点</a>,<p id="anchorName">以id为标记的锚点</p>
分析:当点击a标签就会跳到锚点处,没有缓冲效果,体验一般,而且url里会添加"#anchorName"。这在SPA应用里是不可接收的,因为这影响了路由配置。刷新页面无效。
JavaScript辅助(window.scrollTo方法)
window.scrollTo({ top,left ,behavior}),分别为数字、数字、字符串。指定跳转到距离文档顶部、左边的距离,以及跳转效果(smooth、instant)
跳转时机:添加事件监听
获取元素到文档顶部的距离(offsetTop属性),offsetTop返回当前元素相对于其 offsetParent 元素的顶部的距离,因此我们要通过循环的方式累加来拿到距离文档最顶部的距离
怎么在html中跳转到指定位置的详细内容,希望对您有所帮助,信息来源于网络。