Css - 选择元素内部元素内的文本，外部div中没有​​什么

Question

我有一个html div：

HTML

<li>
    <a>Title</a>
    (0)
</li>

我想要隐藏＆＃34;（0）＆＃34;并留下标题。

我试过像

这样的东西

CSS

li { display:none }
li a {display:block }

隐藏后，不会在标签内显示文字。

我怎么能只隐藏div中的内容而不是隐藏在标签内？

Answer 1

试试这个

   li{
     visibility:collapse;
    }
    li a {
        visibility:visible;
    }

<强> Demo

Answer 2

如果你只想隐藏我将使用它。

li { font-size:0px }
li a {font-size: 20px }

也许在其他情况下，您可以在li标签内使用span

   <li>
     <a>Title</a>
       <span>(0)</span>
   </li>

风格

    li span{ display:none }

Answer 3

您无法使用CSS直接定位文本节点，如here中所述。但是，您可以使用jquery或直接javascript实现所需。

＆＃13;

＆＃13;

 $('li').contents().each(function () {
     if (this.nodeType == Node.TEXT_NODE) $(this).remove();
 });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<ul>
    <li>
        <a>Title</a>
        (0)
    </li>
</ul>

＆＃13;

＆＃13;

＆＃13;

Answer 4

不，你不能。如果隐藏它的父元素，则将隐藏所有子元素。