javascript - 使用 Jquery 隐藏跨度匹配条件中的所有字符串

Question

我试图从页面中隐藏所有 $0.00 字符串并尝试但没有成功。我收到错误:TypeError: hidepricenull.each is not a function。我在 wordpress 中使用它。

HTML

<span class="amount">£200.00</span>
<span class="amount">£200.00</span>

查询

jQuery(document).ready(function($) {
 var hidepricenull = $('span.amount').text();
     hidepricenull.each(function()   {
     if(hidepricenull == '£200.00') {
       $(this).hide(); 
     }
    });
});

预期输出:

从 span 中隐藏 2 个文本

<span class="amount"></span>
<span class="amount"></span>

Answer 1

您的 hidepricenull 值是一个字符串(第一个项目的文本值，因为调用了 text())但您需要集合并访问每个项目的文本:

jQuery(document).ready(function ($) {
    var hidepricenull = $('span.amount');
    hidepricenull.each(function () {
        if ($(this).text() == '£200.00') {
            $(this).hide();
        }
    });
});

请注意，您还可以开始使用相当方便的 jQuery 作用域 DOM 就绪快捷方式:

jQuery(function ($) {
    var hidepricenull = $('span.amount');
    hidepricenull.each(function () {
        if ($(this).text() == '£200.00') {
            $(this).hide();
        }
    });
});

请注意，不再需要临时变量，您可以改用过滤器:

jQuery(function ($) {
    $('span.amount').filter(function () {
        return $(this).text() == '£200.00';
    }).hide();
});

更新以支持多个值:

jQuery(function ($) {
    $('span.amount').filter(function () {
        var text = $(this).text();
        return text == '£200.00' || text == '£100.00';
    }).hide();
});

更新以支持数字比较(比许多值的字符串更快):

jQuery(function ($) {
    $('span.amount').filter(function () {
        var value = parseFloat($(this).text().substring(1));
        return value == 200 || value == 100 || value == 50;
    }).hide();
});