javascript - 根据孩子的内容隐藏父母

Question

我正在尝试根据孩子的内容隐藏父 div：

<div class="featurevalue">Number 1: <span class="value">1</span></div>
<div class="featurevalue">Number 2: <span class="value">0</span></div>
<div class="featurevalue">Number 3: <span class="value">1</span></div>

目前我正在使用这个javascript，但它隐藏了页面上所有具有相同类的div。我需要它来只隐藏父 div。

(function($) {
    $(document).ready(function() {
        var x = $("span.value").text();
        if (x == 0){
            $("div.featurevalue").hide();
        };    
    })
})(jQuery);

有什么建议么？

标签： javascriptjqueryparent-child

Answer 1

您可以使用.filter()来获取具有指定文本的 span 元素，然后使用.closest()来定位 div 和.hide()它们

$("span.value").filter(function() {
  return $(this).text() === "0"
})
.closest("div.featurevalue")
.hide();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="featurevalue">Number 1: <span class="value">1</span></div>
<div class="featurevalue">Number 2: <span class="value">0</span></div>
<div class="featurevalue">Number 3: <span class="value">1</span></div>