Javascript 如果存在不同的类，如何有条件地将CSS应用于类？

我认为：

<div class="bottom-nav container-fluid">
 <div class="container">
  <div class="row mobile-menu-row">
   <div class="col"></div>
  </div>
  <div class="row mobile-menu-row">
   <div class="slidedown"></div>
  </div>

这自然不起作用，因为它将其应用于向下滑动，而不是底部导航部分

我的JS文件有：

const nav = () => {
const mobileButton = document.querySelector('a.mobile-button');
const menu = document.querySelector('.mobile-menu-cont');
const regionLink = document.querySelector('.mobile-menu-row ul > li');
const regionMenu = document.querySelector('.mobile-menu-row ul > li > ul');
const bottom = document.getElementsByClassName('bottom-nav');

function init() {
  mobileButton.addEventListener('click', toggleMenu);
  regionLink.addEventListener('click', toggleSubMenu);
}

let toggleMenu = (e) => {
  e.preventDefault();
  if (menu.classList.contains('slideup')) {
    menu.classList = 'slidedown';
  } else {
    menu.classList = 'slideup';
  }
};
if (menu.classList = 'slidedown'){
  bottom.setAttribute("style", "height: 440px;")
} else {
  bottom.setAttribute("style","height: 0;")
}

我原以为这个条件行得通，但它似乎破坏了页面上的许多不同内容

我也试过：

    let toggleMenu = (e) => {
     e.preventDefault();
     if (menu.classList.contains('slideup')) {
       menu.classList = 'slidedown';
       bottom.setAttribute("style", "height: 440px;")
     } else {
       menu.classList = 'slideup';
       bottom.setAttribute("style", "height: inherit;")
     }
   };

---

这把我在页面上的其他JS都搞砸了。

你就差一点了！不要挤压

底部元素的完整样式属性，只需设置
height
属性，同样，不要替换
菜单的
类名
，只需在类名上加上或减去：

let toggleMenu = (e) => {
  e.preventDefault();
  if (menu.classList.contains('slideup')) {
    menu.className = menu.className.replace('slideup', '');
    menu.className += ' slidedown';
    bottom.style.height = '440px';
  } else {
    menu.className = menu.className.replace('slidedown', '');
    menu.className += ' slideup';
    bottom.style.height = 'inherit';
  }
};

你没试过能给我们看的代码吗？你考虑过媒体查询吗？正确的观点。我编辑了这个问题，并在我当前的JS中添加了正在进行切换的内容。最后我在这两个页面上都做了bottom.setAttribute。我将在标题中测试style.height，有没有一种方法可以只使用CSS？我的意思是，仅当存在另一个CSS类时才应用CSS类？当然，您可以执行
.class-one.class-two{background:red；}
——这就是您的意思吗？
let toggleMenu = (e) => {
  e.preventDefault();
  if (menu.classList.contains('slideup')) {
    menu.className = menu.className.replace('slideup', '');
    menu.className += ' slidedown';
    bottom.style.height = '440px';
  } else {
    menu.className = menu.className.replace('slidedown', '');
    menu.className += ' slideup';
    bottom.style.height = 'inherit';
  }
};