转换将<a href="#id">转换为JavaScript

Question

我希望制作一个菜单。通常为了帮助访问者进入特定区域，我会使用以下方法：

<a href="#id">

将滚动到当前页面上的一个元素，例如<div id="id">。

我想知道是否可以用JavaScript编写此功能？比如我的猜测：

<a href="javascript:#id"></a>  <div id="id">

- Ray

---

为什么您想使用JavaScript而不是<a href="#id"></a>？ - undefined

尝试：https://dev59.com/KHVD5IYBdhLWcg3wKYP-#2368393 - undefined

可能是 JavaScript - 跳转到锚点 的重复问题。 - undefined

Answer 1

只需使用带有元素ID的href的<a>元素即可完成任务:

<a href="#{id}"></a>

但如果出于某种疯狂的原因你想要使用JavaScript来实现这个功能（为什么？），那么有一种方法：

#foo {
    margin-top: 500px
}

<a href="#" onclick="window.location.href='#foo'; return false;" id="anchor">Click to go to foo</a>
 <div id="foo">Some foo content</div>
 <br>
 <a href="#anchor">Back to anchor</a>

- gdoron is supporting Monica

Answer 2

自动滚动功能 通过JavaScript函数滚动任何div或body 滚动功能适用于具有overflow样式的任何元素 无论在body还是div中

使用方法：<a onclick="MWScroll(body Id, target Id, margin top)"></a>

变量： tb = 具有overflow样式的body Id

tid = div Id或具有block样式的任何元素，即您的目标

tde = 滚动后目标元素与其body顶部之间的边距

function MWScroll(tb,tid,tde) {
     var TY = 0;
         TY = document.getElementById(tid).offsetTop;
        document.getElementById(tb).scroll(0, TY -tde);

    }

- Mohamed El Azazy

---

这并不是一个真正的答案。请详细说明您的解决方案，并用简明扼要的英语和示例进行解释。这些问题旨在帮助原始发布者，也能帮助通过Google搜索到达此处的其他人。 - undefined