JS切换类名时CSS visibility显隐效果不生效如何排查

显隐效果不生效是CSS选择器书写错误导致的：

• 你写的激活样式选择器为.visibility.active，该规则仅会匹配同时带有visibility、active两个类名的元素
• 但你要控制显隐的下拉容器类名是link-box，元素本身根本没有visibility这个类，所以哪怕JS逻辑正常给元素加上了active类，这条CSS规则完全匹配不到目标元素，自然不会触发可见状态的切换。

直接把CSS代码末尾错误的选择器替换为正确写法即可：

/* 删除原来的.visibility.active规则，替换为下面的内容 */
.link-box.active {
  visibility: visible;
}

修改后点击“Beallitasok”按钮时，JS给.link-box追加的active类就能正确匹配到显隐样式，覆盖默认的visibility: hidden属性，下拉面板就会正常弹出。

内容的提问来源于stack exchange，提问作者Balage