新增CSS以動態添加tablerow的

Question

我使用jQuery Mobile的並在該網站上創建一個網站，我有一個表，看起來像這樣：

FIDDLE

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jquerymobile/1.4.5/jquery.mobile.min.css"> 
 
<script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script> 
 
<table data-role="table" class="ui-responsive ui-shadow gk-decorate" id="testTable" is="jqm-table"> 
 
    <thead> 
 
    <tr> 
 
     <th data-priority="1">Animal</th> 
 
     <th data-priority="1">Sports</th> 
 
     <th data-priority="1">Names</th> 
 
     <th data-priority="1">Fruits</th> 
 
     <th data-priority="1">Status</th> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 
    <tr> 
 
     <th>Cat</th> 
 
     <td>Football</td> 
 
     <td>Anna</td> 
 
     <td>Apple</td> 
 
     <td></td> 
 
    </tr> 
 
    <tr> 
 
     <th>Dog</th> 
 
     <td>Baseball</td> 
 
     <td>James</td> 
 
     <td>Banana</td> 
 
     <td>Checked</td> 
 
    </tr> 
 
    <tr> 
 
     <th>Shark</th> 
 
     <td>Hockey</td> 
 
     <td>David</td> 
 
     <td>Orange</td> 
 
     <td>Checked</td> 
 
    </tr> 
 
    <tr> 
 
     <th>Ape</th> 
 
     <td>PingPong</td> 
 
     <td>Locke</td> 
 
     <td>Mango</td> 
 
     <td></td> 
 
    </tr> 
 
    </tbody> 
 
</table>

我的問題是：我可以以某種方式將一般的css類或css添加到在Status Coloumn內獲得字符串"Checked"的行中。
我想類似的東西：

var qTable = document.getElementById("testTable"); 
var row = qTable.tBodies[0].insertRow(); 
row.addClass() //error does not support addClass 
row.css({..})//error does not support css.. 

注：表中的內容被動態地添加

Answer 1

使用contains:僞選擇與您的標記，以過濾掉<td>秒，然後讓他們的父節點（<tr> S）

$('td').filter(":contains('Checked')").parent().addClass('sugar') 

https://jsfiddle.net/rttmq4we/

Answer 2

試試這個，

JS

$("#testTable td").each(function(){ 
    if($(this).text() =='StatusChecked'){ 
    $(this).parent().addClass('checked'); 
    } 
}); 

CSS（用於測試風格只）

.checked{ 
    background:green; 
} 

更新小提琴 -

https://jsfiddle.net/guruling/erc3ujzw/ 

Answer 3

試試：

$("#testTable tr").each(function(){ 
    var tds = $(this).find("td"); 
    var statusCell = $(tds[3]); 
    var statusCellTxt = statusCell.text(); 
    if (statusCellTxt.indexOf('Checked') !== -1){ 
    $(statusCell).css('border', '1px solid red'); 
    } 
}); 

看到小提琴HERE。