使用文本的jquery搜索元素，隐藏另一个

Question

如何在元素中搜索文本字符串并隐藏另一个元素？例如:如果div包含John的名称，则应该隐藏包含George名称的div。

<div>John Resig</div>
<div class="test">George Martin</div>
<div>Malcom John Sinclair</div>
<div>J. Ohn</div>
<div>John Resig</div>
<div>George Martin</div>
<div>Malcom John Sinclair</div>
<div>J. Ohn</div>

我试过：

$(document).ready(function() {
$( "div:contains('John')" )."div:contains('George')".hide();
});

或者我不应该首先使用jQuery contains吗？

Answer 1

你的jQuery绝对是不正确的。你需要使用：

if($("div:contains('John')").length){
    $("div:contains('George')").hide();
}

​

$(document).ready(function() {
  if($("div:contains('John')").length){
    $("div:contains('George')").hide();
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>John Resig</div>
<div>George Martin</div>
<div>Malcom John Sinclair</div>
<div>J. Ohn</div>

​

Answer 2

你离我太近了！

$( "div:contains('John')" ).next("div:contains('George')").hide();

使用 next 查找下一个元素匹配。

来源：https://api.jquery.com/next/

Answer 3

我认为你应该使用siblings而不是next，因为如果George在John之前，next就不能工作了

<div>George Martin</div>
<div>John Resig</div>
<div>Malcom John Sinclair</div>
<div>J. Ohn</div>


$(document).ready(function() {
   $("div:contains('John')").siblings("div:contains('George')").hide(); // hide all "Georde"
   // $("div:contains('John')").siblings("div:contains('George')").first().hide(); // hide only first "Georde"
});