TD:包含String但不在span元素中

时间:2016-06-28 11:05:57

标签: jquery

我想检查TD是否包含某个字符串,但仅当该字符串不在SPAN中时才会检查。

让我们说我想检查所有的TDs" TREASURE":

00,BBF,BBDFTP999,051000100,GBP,,-2705248.00,201605
00,BBF,BBDFTP999,059999998,GBP,,-3479679.38,201605
00,BBF,BBDFTP999,061505141,GBP,,-0.40,201605
00,BBF,BBDFTP999,061505142,GBP,,6207621.00,201605
00,BBF,BBDFTP999,061505405,GBP,,-0.16,201605
00,BBF,BBDFTP999,061552000,GBP,,-0.24,201605
00,BBF,BBDFTP999,061559010,GBP,,-0.44,201605
00,BBF,BBDFTP999,062108021,GBP,,-0.34,201605
00,BBF,BBDFTP999,063502007,GBP,,-0.28,201605

到目前为止,我尝试过不同的东西来从搜索中排除span元素,但我没有成功。

<td> TREASURE <span>Water</span> </td> -> YES
<td> Water <span>TREASURE</span> </td> -> NO
<td> TREASURE </td> -> YES
<td> <div>TREASURE</div> <span>Water</span>  </td> -> YES

非常感谢! :)

编辑:

此外,以下情况也应该有效:

$('table tr td:Contains("TREASURE")').not('span').each(function() {
    $(this).addClass('found');
});

1 个答案:

答案 0 :(得分:2)

您可以将 :not() 伪类选择器(或 not() 方法)与 :has() 伪类选择器。

$('table tr td:contains(TREASURE):not(:has(span:contains(TREASURE)))').addClass('found');

// or

$('table tr td:contains(TREASURE)').not(':has(span:contains(TREASURE))').addClass('found');
.found {
  color: red
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table>
  <tr>
    <td>TREASURE <span>Water</span> 
    </td>
    <td>Water <span>TREASURE</span> 
    </td>
    <td>TREASURE</td>
    <td>
      <div>TREASURE</div> <span>Water</span> 
    </td>
  </tr>
</table>
更新: 如果文本包含两个位置,请使用 filter() 方法。实际上在这里做的是克隆td并在应用:contains选择器后从克隆对象中删除span元素。

$('table tr td').filter(function() {
  return $(this)
    .clone() // clone the element
    .find('span') // get all span inside cloned element
    .remove() // remove the spans
    .end() // back to cloned element
    .is(':contains(TREASURE)'); // check the cloned element contains text
}).addClass('found');
.found {
  color: red
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table>
  <tr>
    <td>TREASURE <span>Water</span> 
    </td>
    <td>Water <span>TREASURE</span> 
    </td>
    <td>TREASURE</td>
    <td>
      <div>TREASURE</div> <span>Water</span> 
    </td>
    <td>
      <td>TREASURE <span>TREASURE</span>
      </td>
  </tr>
</table>