侧边栏导航js

<div class="sidebar">
  <ul>
    <li><a href="#">首页</a></li>
    <li><a href="#">关于我们</a></li>
    <li><a href="#">服务</a></li>
    <li><a href="#">联系我们</a></li>
  </ul>
</div>

.sidebar {
  width: 200px;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  background-color: #f1f1f1;
}

.sidebar ul {
  list-style-type: none;
  padding: 0;
}

.sidebar ul li {
  padding: 10px;
}

.sidebar ul li a {
  text-decoration: none;
  color: #333;
}

const links = document.querySelectorAll('.sidebar ul li a');

links.forEach(link => {
  link.addEventListener('click', function(event) {
    event.preventDefault();
    // 处理导航跳转逻辑
    console.log(this.textContent + ' 被点击');
  });
});