如何删除特定页面上的CSS类？ [重复]

Question

这个问题在这里已有答案：

• How to add a CSS class depending on URL path? 3回答

如何从URL（例如.tm-navbar:before）中包含/event/的所有页面中删除CSS类https://example.com/event/more以及以下内容：

• /agb
• /wiederrufsbelehrung
• /impressum

解决方案应该只删除.tm-navbar:before而不是.tm-navbar。

Answer 1

您可以使用JS来执行此操作，如下所示：

if(window.location.pathname.indexof('/event/') > -1) {
    $('.tm-navbar').addClass('dontUseCss');
}

然后在你的CSS中你可以做这样的事情：

.tm-navbar:not(.dontUseCss):before { ... }

Answer 2

解决方案是评论中陈述的混合内容。我用它作为我的方法的模板：https://stackoverflow.com/a/19355623/8207054

并改变了添加CSS的方式。它现在将CSS添加到网站的HTML标签中，以便我可以执行下面发布的CSS。

 switch(window.location.pathname){
          case "/impressum":  $("html").addClass("no-gradient"); break;
          case "/agb":  $("html").addClass("no-gradient"); break;
          case "/datenschutz":  $("html").addClass("no-gradient"); break;
          case "/event/more0":  $("html").addClass("no-gradient"); break;
          case "/event/more1":  $("html").addClass("no-gradient"); break;
          case "/event/more2":  $("html").addClass("no-gradient"); break;
          case "/event/more3":  $("html").addClass("no-gradient"); break;
          case "/event/more4":  $("html").addClass("no-gradient"); break;
          case "/event/more5":  $("html").addClass("no-gradient"); break;
          case "/event/more6":  $("html").addClass("no-gradient"); break;
       }

CSS：

body > html.no-gradient > div.tm-navbar::before {
background: transparent !important;
display: none !important;
}


.no-gradient .tm-navbar:before {
background: transparent !important;
display: none !important;
}

它会删除添加到导航栏中的渐变以获得更好的可读性，但由于JS中定义的页面没有透明的英雄标题，因此不需要它们。这就是为什么我需要修复它。

感谢@MikeMcCaughan，@ devius和@jdmdevdotnet的想法，并帮助解决我的问题:)