CSS：如果隐藏了所有子项，则隐藏父级

Question

我有一个包含组的列表，并使用CSSOM使用文本字段动态过滤内容。这是一种仅使用CSS实现“搜索”的方法。

不幸的是，当过滤器过滤掉所有内容时，组容器仍然可见。我还需要以某种方式使用CSS将display: none设置到它们上面，否则我需要添加一堆JS来控制它们。

这远程可能吗？我知道这是一个很长的镜头，但是有一个选择器可以选择其子项（适合某些选择器）所有必须选择其样式的元素吗？

如果我大大放松了约束，这可能是一个选择器来选择其子项（适合某些选择器）所有必须具有特定类的元素吗？

Answer 1

不，只有通过CSS才能实现：

1. 有no parent selector。
2. 如果仅使用内联CSS隐藏元素，则除:not([style*="display:none"]):not([style*="display: none"])之外没有可见性选择器。
3. 没有CSS方法可以知道所有孩子是否满足某些条件。

这只能使用纯JS循环和条件或通过.parent:not(:has(:visible))等jQuery选择器来解决。