javascript - javascriptの列「値」または「テキスト」に基づいて表の行に色を付ける方法は?

Question

私は「ステータス」として列名を持っています。ステータスが「合格」の場合、その行を緑色で表示する必要があります。「失敗」の場合は赤。javascriptでそれを行う方法は？

for (i=0; i < rows.length; i++) {
    var value = rows[i].getElementsByTagName("td")[0].firstChild.nodeValue;
    if (value == 'Pass') {
        rows[i].style.backgroundColor = "red";
    }
}

これを試しましたが、ブラウザでサポートされていません。親切に助けてください。ありがとう。

Answer 1

jQueryを使用すると、次のことができます。

function CheckStatus(id) {
    var rows = $('#'+id).find("tr")
    $(rows).each(function(){
        var value =  $(this).find('td:first').text();
        if (value == 'Pass') {
            $(this).css('background', 'red');
        }
    });
}

Answer 2

for (i=0; i < rows.length; i++) {
    var value = document.getElementsByTagName("td")[i].firstChild.nodeValue;
    if (value == 'Pass') {
        document.getElementsByTagName("td")[i].style.backgroundColor = "green";
    }
else{ document.getElementsByTagName("td")[i].style.backgroundColor = "red";}
}

このコードを試してください（私はまだ試していませんが、これはあなたが必要とするアイデアです）

Answer 3

スタイルを設定する代わりにクラス名を使用しますが、これを試してください：

for (i=0; i < rows.length; i++) { 
   var value =  = rows[i].cells[0].firstChild.nodeValue;
   if (value == 'Pass') {
        rows[i].className = "red";
    } 
}

Answer 4

あなたはJqueryを使ってみることができます

   $(document).ready(function () { 
            $("#testResults tr").each(function () { 
                var row = $(this).find("td:nth-child(2)").text(); 
                if (row == 'Pass') { 
                    $(this).css('background-color', '#F00'); 
                } else { 
                    $(this).css({ 'background-color': '#0G0',}); 
                } 
            }); 
        });