使用href时如何从html地址栏中删除“#id of a div”？答案

【问题标题】：How to remove "#id of a div" from address bar in html while using href?使用href时如何从html地址栏中删除“#id of a div”？
【发布时间】：2019-05-12 01:30:22
【问题描述】：

我正在制作一个静态网站，我在其中使用 href 转到特定的 div/section 并且运行良好。但是当用户单击特定链接时，我试图从地址栏“http:localhost:3000/index.html/#about”中删除 div 的 id。

索引.html

<a href="#about">About</a>
<a href="contacts">Contacts</a>

<section id="about></section>

<section id="contacts"></section>

【问题讨论】：

为什么要删除它？你有什么搜索这个？
很确定如果没有该#id，div 导航将无法工作。
您可能会找到您的解决方案Here

标签： html

【解决方案1】：

这是最简单的方法：

<a href="#About" id="aboutButton">About</a>

我为此事件侦听器添加了该 ID：

document.getElementById("aboutButton").addEventListener("click", function() {
    window.location.href = location.pathname;
)}

这将删除地址栏中.html之后的所有内容

【讨论】：

【解决方案2】：

这段代码对我有用

 $(function() {
  // Smooth Scrolling
  $('a[href*="#"]:not([href="#"])').click(function() {
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
      var target = $(this.hash);
      target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
      if (target.length) {
        $('html, body').animate({
          scrollTop: target.offset().top
        }, 1000);
        return false;
      }
    }
  });
});

【讨论】：