Javascript 如何更改表格'；s从JSON创建的单元格颜色

我从JSON创建了一个HTML表。该表是大学学期地图，包括学生ID、年份、学期和毕业所需的课程。我已成功创建表，但我希望课程单元格的颜色取决于课程状态。例如，如果学生已接受CSCI 135，则该单元格颜色应为绿色。如果课程正在进行中，单元格颜色应为黄色。如果需要服用，细胞应该是红色的

我对所有课程的要求是

$getCourses = "SELECT * FROM student_majors WHERE student_id = $studID;";

查询课程状态

$status = "SELECT * FROM course_status WHERE student_id = $studID;";

我用来创建表的函数如下

function CreateTableFromJSON() {
        var myCourses = <?php echo $test1; ?> ;
        var col = [] ;
        var col2 = ["Year","Term","Requirement","","","","","Core","","Credits"] ;
        for (var i = 0; i < myCourses.length; i++) {
            for (var key in myCourses[i]) {
                if (col.indexOf(key) === -1) {
                    col.push(key);
                }
            }
        }
        var table = document.createElement("table");
        var tr = table.insertRow(-1);                

        for (var i = 0; i < col2.length; i++) {
            var th = document.createElement("th");     
            th.innerHTML = col2[i];
            tr.appendChild(th);
        }
        for (var i = 0; i < myCourses.length; i++) {
            tr = table.insertRow(-1);
            for (var j = 0; j < col.length; j++) {
                var tabCell = tr.insertCell(-1);
                tabCell.innerHTML = myCourses[i][col[j]];
            }
        }
        var divContainer = document.getElementById("showData");
        divContainer.innerHTML = "";
        divContainer.appendChild(table);
    }

函数CreateTableFromJSON（）{ var myCourses=； var col=[]； var col2=[“年”、“期限”、“要求”、“要求”、“核心”、“信用度”、“信用度”]； 对于（var i=0；i 我曾尝试使用jquery、js函数根据课程状态更改单元格的颜色，但这些都不起作用

function f_color(){
            if (document.getElementByTagName('td').value = 'CSCI135') {
                document.getElementByTagName('td').style.background="yellow";
            }
        }
         for (var k = 0; k< col.length; k++){
                $("#output td:contains(CSCI135)").attr("style","background-color:green");
                $("#output td:contains(CSCI135)").attr("style","background-color:red");
            }

函数f_color（）{
if（document.getElementByTagName（'td'）。值='CSCI135'）{
document.getElementByTagName（'td'）.style.background=“黄色”；
}
}
对于（变量k=0；k

我编写了一个示例代码片段，用于在准备表格时设置背景色。您可以参考这两种设置背景颜色的方法，并尝试在您的场景中实现它

var myCourses=[{
“年份”：2018年，
“期限”：“A”，
“要求”：“课程”，
“核心”：“CSCI135”，
“学分”：120
},
{
“年份”：2019年，
“期限”：“A”，
“要求”：“课程”，
“核心”：“CSCI136”，
“学分”：130
},
{
“年份”：2019年，
“期限”：“A”，
“要求”：“课程”，
“核心”：“CSCI200”，
“学分”：100
},
{
“年份”：2019年，
“期限”：“A”，
“要求”：“课程”，
“核心”：“CSCI123”，
“学分”：140
},
{
“年份”：2019年，
“期限”：“A”，
“要求”：“课程”，
“核心”：“abc”，
“学分”：150
}
];
函数CreateTableFromJSON（）{
var col=[]；
var col2=[“年”、“期限”、“要求”、“核心”、“信用”]；
对于（var i=0；i130）{
tabCell.style.background='green'；
}
else if（myCourses[i][col[j]]<130）{
tabCell.style.background='red'；
}
否则{
tabCell.style.background='yellow'；
}
}
/*第二条路*/
if（col[j]=“Core”）{
如果（myCourses[i][col[j]]=='CSCI135'）{
tabCell.className='success'；
}
else if（myCourses[i][col[j]]=='CSCI123'）{
tabCell.className='completed'；
}
否则{
tabCell.className='inprocess'；
}
}
}
}
var divContainer=document.getElementById（“showData”）；
divContainer.innerHTML=“”；
divContainer.appendChild（表）；
}
CreateTableFromJSON（）
。成功{
背景：绿色；
}
.完成{
背景：红色；
}
.进程中{
背景：黄色；
}
（变量i=0；i

从何处获取状态？因为这是一个JavaScript问题，提供

    for (var i = 0; i < myCourses.length; i++) {
      tr = table.insertRow(-1);  // ADD JSON DATA TO THE TABLE AS ROWS.
        for (var j = 0; j < col2.length; j++) {
            var tabCell = tr.insertCell(-1);
            var done_course = <?php echo json_encode($done_course); ?> ;
            var pending_course = <?php echo json_encode($pending_course); ?> ;
            var progress_course = <?php echo json_encode($progress_course); ?> ;
            tabCell.innerHTML = myCourses[i][col[j]];     
              if (done_course.includes(myCourses[i][col[j]])) {
                tabCell.className = 'success'; 
              } else if (pending_course.includes(myCourses[i][col[j]])) {
                tabCell.className = 'completed'; }
                  else {
                    tabCell.className = 'inprocess'; }
        }
    }