点击<a> tag as menu link

Question

trying to find solution of scrolling down while clicking on tag who supposed to be menu link. I've read dozens of resources. e.preventDefault() and return false form click handler doesn't help me.

Can you somehow lead me to solution ?

here is the short video, which should give you a clue what I'm trying to fix

后向下滚动

代码片段：

的index.html

  <nav>
<ul class="tab-menu">
  <li class="tab-menu-item">
    <a class="tab-menu-item-link" href="#logs">
      First tab
    </a>
  </li>
  <li class="tab-menu-item">
    <a class="tab-menu-item-link" href="#feeds" id="test">
      Second tab
    </a>
  </li>
  <li class="tab-menu-item">
    <a class="tab-menu-item-link" href="#flickr">
      Third tab
    </a>
  </li>
</ul>
</nav>

 <div class="tab-content-container">
  <div id="logs" class="tab-content"></div>
  <div id="feeds" class="tab-content"></div>
  <div id="flickr" class="tab-content">
  Content of third tab
  </div>
</div>

index.js

import parsedLogs from './logs';
import { createList } from './helpers';
import feeds from './feeds';

const renderStaticContent = (container, content) => {
  container.appendChild(content);
};

const renderDynamicContent = (container, content) => {
  container.innerHTML = '';
  container.appendChild(content);
};

const renderLogs = () => {
  const containerId = 'logs';
  const container = document.getElementById(containerId);
  if (!container.hasChildNodes()) {
    const {
      hostnames,
      files,
    } = parsedLogs;
    const topHostnames = hostnames.slice(0, 5);
    const topFiles = files.slice(0, 5);
    const hostsList = createList({
      list: 'list',
      item: 'item',
    }, topHostnames, 'logs');

    const filesList = createList({
      list: 'list',
      item: 'item',
    }, topFiles, 'logs');

    renderStaticContent(container, hostsList);
    renderStaticContent(container, filesList);
  }
};

const renderFeeds = () => {
  const containerId = 'feeds';
  const container = document.getElementById(containerId);
  feeds.get().then((data) => {
    console.log(data.length);
    const feed = createList({
      list: 'list',
      item: 'item',
    }, data, 'feeds');
    renderDynamicContent(container, feed);
  });
};

const renderFlickr = () => {
};

const initialTabId = '#logs';

const hashChangeHandler = () => {
  if (!location.hash) {
    return location.assign(initialTabId);
  }
  switch (location.hash) {
  case '#feeds':
    return renderFeeds();
  case '#flickr':
    return '';
  default:
    renderLogs();
    break;
  }
};

const DOMContentLoadedHadler = () => {
  hashChangeHandler();
};

window.addEventListener('DOMContentLoaded', DOMContentLoadedHadler);

window.addEventListener('hashchange', hashChangeHandler);