javascript - 値が >= 0 の場合、テーブル セルの値を赤にする

Question

>= 0の場合、テーブルのセル値を作成するにはどうすればよいですか?テーブルの行の背景色を赤にしますか? ちなみに、値はデータベースから取得されます。

Answer 1

編集後にバニラ JS を使用する: (これは実際に動作するフィドルです) (この例では、行全体が赤く色付けされます)

window.onload = function(){ // After all the contents has loaded
    var cells=document.getElementsByTagName("td"); //select all the table cell tags
    for(var i=0;i<cells.length;i++){  //iterate through each of them
       //check if content is more than 0
       if(parseFloat(cells[i].textContent || cells[i].innerText)>=0){ 
           cells[i].style.backgroundColor="red"; //change background to red
       }
    }
};

最新のブラウザーのみをサポートする必要がある場合は、次のソリューションの方が優れていると思います。

window.addEventListener("DOMContentLoaded", function(e) {
    document.getElementsByTagName("td").filter(function(elem){
        return parseFloat(elem.textContent) >= 0;
    }).forEach(function(elem){
        elem.style.backgroundColor="red";
    });
 }, false);

古いコンテンツ、jquery ソリューション:

---

$(function(){  //after the dom is loaded
    $("td").each(function() {
        if(parseFloat($(this).text()) >= 0){ //for every element whose text's float value is less than 0
           $(this).css("background-color","red"); //change the background color to red
        }
    }  
}