javascript - jQuery :contains full word

Question

我想通过子文本但完全匹配(两个名称)来选择父元素。

<div class="card">
   <div class="name">buggy</div>
   <div class="name">fruits</div>
</div>
<div class="card"> <!-- select only this one card -->
   <div class="name">bug</div>
   <div class="name">fruits</div>
</div>

$('.card:contains("bug"):contains("fruits")') - 在这种情况下不起作用，因为它从 buggy< 开始抓取两张卡 也包含 bug。

$('.card').filter(function() {
    return $(this).find('.name').text() === "bug" && $(this).find('.name').text() === "fruits";
});

这也行不通。

如何实现子元素文本的全匹配？

Answer 1

使用.filter ，就像您正在做的那样，但构造每个元素的文本内容的数组，然后检查您要查找的每个单词是否是 include数组中的 d:

const $filteredCards = $('.card').filter(function() {
  const nameTexts = $(this)
    .children()
    .map(function() { return $(this).text() })
    .get();
  return nameTexts.includes('bug') && nameTexts.includes('fruits')
});

$filteredCards.css('background-color', 'yellow');

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="card">
   <div class="name">buggy</div>
   <div class="name">fruits</div>
</div>
<div class="card"> <!-- select only this one card -->
   <div class="name">bug</div>
   <div class="name">fruits</div>
</div>