如何處理字符串的indexOf返回的值？

Question

我只想使用條件返回的值來做某事

{{#each maindata-hold.[2].qa}}
    <div class="section">
        <a href="javascript:void(0)" class="person-link" id="{{id}}">
            <span class="name-role" id="{{id}}">
                {{name}} <br> {{role}}
            </span>
        </a>
    </div>
{{/each}}

我所需要的只是遍歷html的這一部分，並獲取包含值“ QA Manager”的節點之一的值，我正在這樣做

if ($('.person-link').text().toLowerCase().indexOf('qa m') > -1) {            
    $('.person-link').css('backgroundColor', 'black');
}

但是通過這種方式，最后所有節點都變成黑色背景，對於質量檢查管理器，我只需要黑色背景，有什么建議嗎？

Answer 1

如何使用:contains()選擇器

$('.person-link:contains("qa m")').css('background-color', 'red');

---

編輯（感謝skobaljik ）：請注意，此方法區分大小寫。 為了使其在上述情況下有效，您需要以這種方式擴展jQuery。

Answer 2

使用filter是一個不錯的選擇：

$('.person-link').filter(function(){
    return $(this).text().toLowerCase().indexOf('qa m') > -1;
}).css('backgroundColor', 'black');

 $('.person-link').filter(function(){ return $(this).text().toLowerCase().indexOf('qa m') > -1; }).css({'background': '#0095ff', 'color': '#fff'}); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <div class="person-link">Project Manager</div> <div class="person-link">QA Manager</div> <div class="person-link">Request Manager</div> 

Answer 3

您必須使用.css()的輔助功能

 $('.person-link').css("backgroundColor", function(_,_css){ return this.textContent.toLowerCase().indexOf('qa m') > -1 ? "black" : _css; }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <div class="person-link">Project Manager</div> <div class="person-link" style="color:white">QA Manager</div> <div class="person-link">Request Manager</div> 

Answer 4

我通常會做類似的事情：

$(".person-link").each(function(){
  var $item = $(this);
  if ( $item.text().toLowerCase().indexOf('qa m') > -1){
    $item.css('backgroundColor', 'black');
  }
});

這樣，它將檢查每個索引，如果匹配，則更改單個css，而不是所有匹配的類。