来源:https://www.yoodb.com/notes/1001.html

方式一:传统href锚点定位
网上有很多通过href锚点定位的方式,也有很多千奇百怪的方法!这种跳转方法实现的是从某个位置跳转到同页面的另一个位置。

通过href定位会在访问地址栏中增加ID值,影响url正常请求,不太友好; 另外是href定位如果不想定位到浏览器界面顶部位置时, 需要在对应的ID值内部元素中增加外间距,如果需要多个同样定位元素展示,就会导致间距过大页面太难看了。

类似如下图效果,就不太实用:

图

#方式二:原生js指定位置定位
这种方式就可以解决多个同界面的不用元素锚点定位,只需要两步操作非常简单,网上的方式有些都是乱用方法。

侧边栏锚点定位不同元素位置,vue界面

export default {
methods: {
goMarginTop(value){
let offsetTop = document.getElementById(value).offsetTop - 20;
window.scrollTo(0,offsetTop);
}
},
};

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐