倘若打开了一个一级菜单则另外被打开的一级菜单则关闭

实现这个功能，需要在JavaScript代码中添加一些额外的逻辑处理。具体实现方式可以参考下面的代码示例。

JavaScript代码：

// 获取所有一级菜单元素
var menuItems = document.querySelectorAll('.menu-item');

// 遍历所有一级菜单元素，给它们绑定点击事件
menuItems.forEach(function(item) {
  item.addEventListener('click', function() {
    // 获取当前一级菜单对应的二级菜单
    var subMenu = item.querySelector('.sub-menu');
    if (subMenu) {
      // 判断当前二级菜单的状态，并根据状态执行相应的操作
      if (subMenu.style.display === 'none') {
        // 如果当前二级菜单是关闭的，则先关闭其他已经打开的二级菜单
        menuItems.forEach(function(item) {
          var otherSubMenu = item.querySelector('.sub-menu');
          if (otherSubMenu && otherSubMenu !== subMenu && otherSubMenu.style.display !== 'none') {
            otherSubMenu.style.display = 'none';
          }
        });
        // 然后打开当前二级菜单
        subMenu.style.display = 'block';
      } else {
        // 如果当前二级菜单是打开的，则关闭它
        subMenu.style.display = 'none';
      }
    }
  });
});

在这个代码中，我们添加了一个新的逻辑处理，它会在打开一个二级菜单时，先关闭其他已经打开的二级菜单。这个处理使用了forEach方法遍历所有一级菜单元素，然后判断它们对应的二级菜单是否已经打开，如果已经打开，则关闭它。这样就可以确保同一时间只有一个二级菜单是打开的。