javascript - 如何根据 .addClass 在 Jquery 中的特定搜索突出显示表行

Question

我可以通过以下方式采用特定的搜索词来突出显示表格的特定行:

if(tableRows[i].innerText.toLowerCase().indexOf(searchTerm) != -1){
    particularRow.style.backgroundColor = "#90ee90";
 }
else{
    particularRow.style.backgroundColor="transparent";
}

fiddle 中的完整代码:http://jsfiddle.net/swarup195/a2aa6jfk/4/是否有任何建议可以更有效地做到这一点，例如通过 addClass() 方法 ???

Answer 1

你可以使用 :contains ( http://api.jquery.com/jquery.contains/ )

HTML

<table>
  <tr>
    <td> One </td>
    <td> Two </td>
  </tr>
  <tr>
    <td> Three </td>
    <td> Four </td>
  </tr>
</table>

<button id="button"> Highlight row </button>

JS

$('#button').click(function() {
    $( "tr:contains('One')" ).addClass( "highlight" );
});

CSS

.highlight { background: red }

演示:http://jsfiddle.net/e7h76dz1/