使用jquery将菜单动态设置为活动

<script src="https://cdn.jsdelivr.net/npm/jquery/dist/jquery.min.js"></script>

<ul id="menu">
  <li><a href="#">首页</a></li>
  <li><a href="#">产品</a></li>
  <li><a href="#">服务</a></li>
  <li><a href="#">关于我们</a></li>
</ul>

$(document).ready(function() {
  $('#menu li').click(function() {
    // 移除所有菜单项的活动状态
    $('#menu li').removeClass('active');
    
    // 将当前点击的菜单项设置为活动状态
    $(this).addClass('active');
  });
});

#menu li.active {
  background-color: #f00;
  color: #fff;
}