Question

如果第一个包含单词ZERO？

，如何将类添加到第二个td

$('td:nth-child(1):contains("ZERO")').closest('td:nth-child(2)').addClass('intro').removeClass('part-pakiet');

Answer 1

使用adjacent sibling combinator（+）：

$("td:nth-child(1):contains(ZERO) + td").addClass('intro').removeClass('part-pakiet');

示例：

＆＃13;

$("td:nth-child(1):contains(ZERO) + td").addClass('intro').removeClass('part-pakiet');

＆＃13;

body {
  font-family: sans-serif;
}
table {
  border-collapse: collapse;
}
td, td {
  border: 1px solid #ddd;
}
.intro {
  color: green;
  font-weight: bold;
}

＆＃13;

<table>
  <tbody>
    <tr>
      <td>first cell - no match</td>
      <td>second cell</td>
      <td>third cell with ZERO</td>
      <td>...to prove to ourselves this doesn't match</td>
    </tr>
    <tr>
      <td>first cell - ZERO</td>
      <td>second cell</td>
      <td>third cell with ZERO</td>
      <td>...to prove to ourselves this doesn't match</td>
    </tr>
    <tr>
      <td>first cell - no match</td>
      <td>second cell</td>
      <td>third cell with ZERO</td>
      <td>...to prove to ourselves this doesn't match</td>
    </tr>
    <tr>
      <td>first cell - ZERO</td>
      <td>second cell</td>
      <td>third cell with ZERO</td>
      <td>...to prove to ourselves this doesn't match</td>
    </tr>
  </tbody>
</table>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

＆＃13;

Answer 2

在您的示例中，您错误地使用了closest。这里最近的是指与选择器匹配的最接近的祖先元素（如果它与选择器匹配，则是当前元素）。因此，在这种情况下，您必须获得最接近的tr，然后是第二个td。为了记录，这是一个使用closest的工作代码。

$('td:nth-child(1):contains("ZERO")').closest('tr').find('td:nth-child(2)').addClass('intro').removeClass('part-pakiet');

但是，在这种情况下，您不需要使用closest，因为使用next选择器的方式更简单。

$('td:nth-child(1):contains("ZERO")').next().addClass('intro').removeClass('part-pakiet');

Answer 3

如果文本肯定等于该单词，则采用更直接的方法。其他明智的使用：contains伪：

var tableElement = $('.table td:first-child'),
    wordToCheck  = 'ZERO';

if (tableElement.text() === wordToCheck) {
  tableElement.next().addClass('intro').removeClass('part-pakiet');
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table">
    <tbody>
        <tr>
            <td>ZERO</td>
            <td class="part-pakiet"></td>
        </tr>
    </tbody>
</table>

Answer 4

您可以使用filter()功能：

$('td').filter(function(){
    return ~$(this).prev('td').text().indexOf('ZERO'); // check if prev td contains 'ZERO' text
}).addClass('intro').removeClass('part-pakiet');

如果第一个包含一些单词，如何将类添加到第二个td？

4 个答案: