I'm looking to hide spans that contain a 0. I've looked at other code and I've tried to adapt it but I can't get it to work correctly. I want it to only hide the span when the contents is a "0", but when running the code below it also hides any number that contains 0, so 10 for example, which I don't want.

我要隐藏包含0的跨度。我看过其他的代码，我试着去修改它，但是我不能让它正确地工作。我希望它只在内容为“0”时隐藏span，但当运行下面的代码时，它也会隐藏包含0的任何数字，例如10，我不想要它。

Just to make it a little clearer, the span should only display if the number inside it is greater than 0 (it's a counter that starts from 0 so can't be less than 0 anyway).

为了更清楚一点，张成的空间应该只显示在它里面的数字大于0的时候(它是一个从0开始的计数器，所以不能小于0)。

Any help is appreciated.

任何帮助都是感激。

HTML

<div id="post-excerpts-likes">
    <a href="#" class="zilla-likes" id="zilla-likes-175519" title="Like this">
        <span class="zilla-likes-count">0</span>
    </a>
</div>

jQuery

$(".zilla-likes-count:contains('0')").hide();

Please also note that there are going to multiple spans on the page all with the same class, I would like the code to affect them all.

还请注意，页面上有多个span都具有相同的类，我希望代码能够影响它们。

4 个解决方案

#1

You need to select element has exactly equal text but the :contains() isn't what you want. The .filter() is a good function to filtering selected element based on it text.

您需要选择元素具有完全相同的文本，但是:contains()不是您想要的。filter()是基于it文本过滤选定元素的一个很好的函数。

$(".zilla-likes-count").filter(function(){
  return $(this).text().trim() === "0";
}).hide();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="post-excerpts-likes">
    <a href="#" class="zilla-likes" id="zilla-likes-175519" title="Like this">
        <span class="zilla-likes-count">Text0Text</span>
        <span class="zilla-likes-count">0</span>
    </a>
</div>

#2

Loop through them each one by one, and check the contents with .text():

将它们逐一循环，并使用.text()检查内容:

$(".zilla-likes-count").each(function(){
    if ($(this).text() === '0') {
        $(this).hide();
    }
});

#3

You can iterate each matching element and then check its text to see if it exactly matches "0" and hide it if it does.

您可以迭代每个匹配元素，然后检查其文本，看看它是否与“0”匹配，如果匹配，则隐藏它。

Here you go:

给你:

$(".zilla-likes-count").each((i,e) => e.textContent === '0' ? $(e).hide() : '');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="post-excerpts-likes">
    <a href="#" class="zilla-likes" id="zilla-likes-175519" title="Like this">
        <span class="zilla-likes-count">0</span>
        <span class="zilla-likes-count">10</span>
        <span class="zilla-likes-count">55</span>
                        
    </a>
   
</div>

#4

simple.. just iterate over the class array and check if its value contains 0. so, the code would be like:

简单. .只需遍历类数组并检查其值是否包含0。所以，代码会是这样的:

$(".zilla-likes-count").each(function(){
    if ($(this).text() === '0') $(this).hide();
});

#1