如果在 Table 中显示 "OK",请将其涂成绿色

If it Says "OK" in the Table, Paint it Green

我在“Google 脚本”的帮助下创建了一个网页。我使用以下代码将数据拉到网页。如果“col14”列的数据等于“OK”,我希望当前行的颜色为绿色。我该怎么做?

google.script.run.withSuccessHandler(generateTable).getTableData(username);

function generateTable(dataArray){

      var tbody = document.getElementById("table-body");
      dataArray.forEach(function(r){  

      var row = document.createElement("tr");
      var col1 = document.createElement("td");
      var col2 = document.createElement("td");
      var col3 = document.createElement("td");
      var col4 = document.createElement("td");
      var col5 = document.createElement("td");
      var col6 = document.createElement("td");
      var col7 = document.createElement("td");
      var col8 = document.createElement("td");
      var col9 = document.createElement("td");
      var col10 = document.createElement("td");
      var col11 = document.createElement("td");
      var col12 = document.createElement("td");
      var col13 = document.createElement("td");
      var col14 = document.createElement("td");
      col1.textContent = r[0];
      col2.textContent = r[1];
      col3.textContent = r[2];
      col4.textContent = r[3];
      col5.textContent = r[4];
      col6.textContent = r[5];
      col7.textContent = r[6];
      col8.textContent = r[7];
      col9.textContent = r[8];
      col10.textContent = r[9];
      col11.textContent = r[10];
      col12.textContent = r[11];
      col13.textContent = r[12];
      col14.textContent = r[13];
      row.appendChild(col1); 
      row.appendChild(col2);   
      row.appendChild(col3);
      row.appendChild(col4); 
      row.appendChild(col5);   
      row.appendChild(col6);
      row.appendChild(col7);
      row.appendChild(col8);
      row.appendChild(col9);
      row.appendChild(col10);
      row.appendChild(col11);
      row.appendChild(col12);
      row.appendChild(col13);
      row.appendChild(col14);
      tbody.appendChild(row);
  
});
}

我相信你的目标如下。

  • r[13]的值为OK时,您想将行的背景颜色设置为绿色。

以你的情况为例,下面的修改怎么样?

发件人:

row.appendChild(col14);
tbody.appendChild(row);

收件人:

row.appendChild(col14);

if (r[13] == "OK") row.style.backgroundColor = "green"; // Added

tbody.appendChild(row);
  • 或者,if (r[13].toUpperCase() == "OK") row.style.backgroundColor = "green";.

添加到@Tanaike 的回答中,您应该阅读一些关于 js 中的循环的内容。

如果将复制粘贴行替换为循环,您的代码将更有意义,就像这样

  google.script.run.withSuccessHandler(generateTable).getTableData(username);

  function generateTable(dataArray){

        var tbody = document.getElementById("table-body");
        dataArray.forEach(function(r){  

        var row = document.createElement("tr");
        for(i=0; i<14; i++) {
              var col = document.createElement("td");
              col.textContent = r[i];
              row.appendChild(col); 
        }
        if(r[13] == "OK")
              row.style.color = "green";
        tbody.appendChild(row);
  }