Question

是否有一个没有文本节点的元素的CSS伪类：

div:nocontent {
    display: none;
}

我知道有:empty伪类，但我想要的东西应该忽略标签......

例如：

<div>
    <p></p>
</div>

对此有何解决方案？

修改

为了澄清它可能是这样的语法：

<div class="checker">
    <div class="somemarkupcontainerthatcomesfromthesystemandcantberemoved"></div>
</div>

隐藏整个事情（这将是最佳的）：

.checker:nocontent {
    display: none;
}

Answer 1

如果你想定位div，你需要一个尚未存在的父选择器，所以要解决这个问题。

根据Hitmands的建议，check this post为脚本示例。

说到脚本，还有一个服务器端方法，替换脚本可以在将结果发送给客户端之前解析出空标签。

如果你想定位p，如果你是div，那么你可以这样做。

＆＃13;

div {
  border: 2px solid red;
  min-height: 20px;
}
p {
  border: 2px solid blue;
  height: 20px;
}
div:not(:empty) p:empty {
  display: none;
}

＆＃13;

<div>
    <p></p>
</div>
<br />
<div>
    <p>Hey</p>
</div>

＆＃13;

Answer 2

是，empty检查节点是否为空（因此没有文本且没有子节点）。

您的目的没有仅限CSS的选项。

没有文本的元素的CSS伪类

2 个答案: