jQuery

Question

使用jQuery，如何根据字符串是什么将class添加到table中的元素？

例如，我有这样一个table：

$('td:contains("Big pineapple!")').addClass('big-pineapple');

.big-pineapple {
  background: yellow;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.1/jquery.min.js"></script>
<table class="table-one">
      <tr>
        <th>Name</th>
        <th>Email</th>
        <th>Where are you</th>
        <th>What are you</th>
      </tr>
      <tr>
        <td>Alfreds</td>
        <td>Alfreds@Alfreds.com</td>
        <td>I'm here</td>
        <td>Big pineapple!</td>
      </tr>
      <tr>
        <td>Maria</td>
        <td>Maria@Maria.com</td>
        <td>I used to be there</td>
        <td>A lamp</td>
      </tr>
      <tr>
        <td>Anders</td>
        <td>Anders@Anders.com</td>
        <td>Why you ask</td>
        <td>Big pineapple!</td>
      </tr>
      <tr>
        <td>Island</td>
        <td>Island@Island.com</td>
        <td>I don't even know</td>
        <td>Big pineapple!</td>
      </tr>
      <tr>
        <td>Matt</td>
        <td>Matt@Matt.com</td>
        <td>Everywhere</td>
        <td>Not Big pineapple!</td>
      </tr>
    </table>

所以我想添加 classes 完全基于字符串是什么。所以在这个例子中，我要向每个包含文本 Big pineapple!

的字段添加 Class big-pineapple

我可以用包含选择器那样捕捉它，但如果这是文本中唯一的东西，我想匹配它（所以不是在文本是 Not Big pineapple 的最后一部分！).

Answer 1

我不知道是否有这样的选择器，但您可以使用 filter 并检查每个 td.

的 html()

var f =$('td').filter(function(i,o) { return $(o).html() === 'Big pineapple!' });
f.addClass('big-pineapple');

.big-pineapple {
  background: yellow;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table-one">
      <tr>
        <th>Name</th>
        <th>Email</th>
        <th>Where are you</th>
        <th>What are you</th>
      </tr>
      <tr>
        <td>Alfreds</td>
        <td>Alfreds@Alfreds.com</td>
        <td>I'm here</td>
        <td>Big pineapple!</td>
      </tr>
      <tr>
        <td>Maria</td>
        <td>Maria@Maria.com</td>
        <td>I used to be there</td>
        <td>A lamp</td>
      </tr>
      <tr>
        <td>Anders</td>
        <td>Anders@Anders.com</td>
        <td>Why you ask</td>
        <td>Big pineapple!</td>
      </tr>
      <tr>
        <td>Island</td>
        <td>Island@Island.com</td>
        <td>I don't even know</td>
        <td>Big pineapple!</td>
      </tr>
      <tr>
        <td>Matt</td>
        <td>Matt@Matt.com</td>
        <td>Everywhere</td>
        <td>Not Big pineapple!</td>
      </tr>
    </table>

jQuery - 如何将 class 添加到元素，具体取决于字符串是什么

jQuery - How to add class to an element, depending on what the string is

string

text

selector