导航栏有若干个栏目，点击其中一个 让它背景变色，其他的都为原始颜色

可以使用 JavaScript 来实现这个功能。首先，为每个导航栏项目添加一个点击事件，当用户点击时，将该项目的背景色改变，同时将其他项目的背景色改回原始颜色。以下是一个简单的示例代码：

HTML 代码：

<ul class="nav">
  <li class="nav-item active">首页</li>
  <li class="nav-item">新闻</li>
  <li class="nav-item">产品</li>
  <li class="nav-item">关于我们</li>
</ul>

CSS 代码：

.nav {
  list-style: none;
  padding: 0;
  margin: 0;
}

.nav-item {
  display: inline-block;
  padding: 10px 20px;
  cursor: pointer;
}

.nav-item.active {
  background-color: #ccc;
}

JavaScript 代码：

var navItems = document.querySelectorAll('.nav-item');

for (var i = 0; i < navItems.length; i++) {
  var item = navItems[i];
  
  item.addEventListener('click', function() {
    // 将所有项目的背景色恢复为原始颜色
    for (var j = 0; j < navItems.length; j++) {
      navItems[j].classList.remove('active');
    }
    
    // 将当前项目的背景色改变
    this.classList.add('active');
  });
}

当用户点击某个导航栏项目时，JavaScript 代码会遍历所有项目，将它们的背景色恢复为原始颜色，然后将当前项目的背景色改变为指定的颜色。