Javascript 单击导航链接时，如何向下滚动到导航栏

我希望能够在点击导航栏中的链接时自动向下滚动。现在，当单击导航栏中的链接时，页面将重新加载并返回到页面顶部。我使用JQuery来隐藏未选中的部分，现在我需要在单击链接时添加滚动方法。或者构建它，这样当选择导航栏链接时，页面将使用新的未隐藏部分重新加载，页面将向下移动到导航栏。如果可能的话，我希望看到两种方法

 <div id="tab_container">
                    <nav id="tabs">
                        <ul id="nav">
                            <li class="active"><a href="#">About</a></li>
                            <li class="inactive"><a href="#">Services</a></li>
                            <li class="inactive"><a href="#">Our Staff</a></li>
                            <li class="inactive"><a href="#">book</a></li>
                            <li class="inactive"><a href="#">Gift Cards</a></li>
                            <li class="inactive"><a href="#">Reviews</a></li>
                        </ul>
                    </nav>
                </div>

您需要为指向的链接提供一个ID。如果您仅链接到“#”，则页面将仅重新加载

此链接将跳转到H2上的相应ID

    <a href="#mylink">Click to move to ID 'myLink'</a>

    <h2 id="myLink">My link</h2>

我的链接

对于jQuery，您使用了

.hide（）

、

.toggle（）

还是

.remove（）

.hide（）

，但不会将其从DOM中删除

.toggle（）

---

.remove（）

实际上是从DOM中删除的，之后就不能再对其进行操作了。

回答得好！这么简单，我的页面现在看起来更专业了，我学到了一些东西！