带有选择器列表传入的 css :not() 选择器答案

【问题标题】：css :not() selector with selector list incoming带有选择器列表传入的 css :not() 选择器
【发布时间】：2015-05-13 05:42:28
【问题描述】：

我有很多 css 选择器和很多选择器异常，所以我使用 :not 将它们排除在外...

示例（只是一些我不需要的选择器）：

[class*="-dashboard-"]:not([class$="-binding"]), [class*="-dashboard "]:not([class$="-binding"]), [class$="-dashboard"]:not([class$="-binding"])

但我更喜欢的是：

([class*="-dashboard-"],[class*="-dashboard "],[class$="-dashboard"]):not([class*="-binding-"],[class*="-binding "],[class$="-binding"])

或其他东西，它比工作更短，更容易编辑，不那么重复......

我的问题是我在大列表中有选择器。允许用户添加/删除列表，因此我必须动态更改选择器和异常。

有没有人想把那个做空？？？

【问题讨论】：

为什么选择器的使用如此复杂，浏览器在渲染这种复杂的 CSS 代码时会死机..
您能否展示您的 HTML 的 sn-p 以准确展示您想要选择的元素？没有它，很难尝试和猜测。而且可能有点容易出错。
如果您需要如此复杂的选择器来做某事，那么您的 HTML 肯定处于糟糕的状态。如果出于某种原因您确实需要这样做，我会查看 sass 或其他预处理器以生成完整列表，而无需正则表达式选择，这可能会非常缓慢地呈现

【解决方案1】：

通常情况下，我的 CSS 外观越来越具有特异性。一个非常通用的规则设置了很多默认值，然后肯定匹配您给我们的那些规则之一的东西会用其他东西覆盖该样式。

例如，您可以为任何以“-binding”结尾的东西设置一个更高优先级的规则，使元素不可见，或者您打算为它们设置的任何东西。简单来说，计算一个 CSS 规则的优先级：

我认为在元素中添加更多易于选择的类会做得很好，即任何添加 lolwtf-dashboard 类的东西也应该添加易于 CSS 选择的 dashboard 类。

【讨论】：