Css -在元素内部选择文本元素，而外部div中没有什么内容。

Question

我有一个html div：

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

我想隐藏"(0)“并留下标题。

我试过

CSS

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

不显示隐藏后的a标记内的文本。

我怎么能只把它藏在div里面而不是在a标签里呢？

Answer 1

尝尝这个

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

演示

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为目标。但是，您可以使用jquery或直接的javascript实现您想要的结果。

​

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

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

​