如何使用字符串的 indexOf 返回的值

How do I work with value returned by indexOf of an string?

本文关键字:返回 indexOf 字符串 何使用      更新时间:2023-09-26

我只想对条件返回的值做点什么

{{#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 管理器"的节点之一的值,我就是这样做的

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

最后所有节点都获得了黑色背景,我只需要黑色的QA管理器,有什么建议吗?

使用 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>

如何使用:contains()选择器

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

编辑(感谢 skobaljik):请注意,此方法区分大小写。为了使它在上述情况下工作,您需要以这种方式扩展jQuery。

我通常会做这样的事情:

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

这样,它将检查每个索引,如果匹配,则更改单个CSS,而不是所有匹配的类。

你必须

使用.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>