如果在 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);
}
我在“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);
}