javascript - Javascript如何实现数组索引比较？

Question

我有一个基于单元格内容设置样式的表格。单元格内容仅限于特定数据，因此我创建了一个数组。如果我引用数组的索引，我可以设置单元格的样式:

var greencell = ["item1", "item2", etc]
var cells = document.getElementById("mytable").getElementsByTagName("td");
for (var i = 0; i < cells.length; i++) {
  if (cells[i].innerHTML == greencell[0]) {
    cells[i].style.backgroundColor = "#80ff80";
  }
}

但是，我需要访问整个数组。当我设置比较 == greencell 时，不会应用样式。我缺少什么？我是否正确地处理了这个问题？与 cells 循环类似地循环遍历数组并在循环结果上设置比较？我现在脑子一片困惑

谢谢!

Answer 1

您需要循环遍历数组:

var greencell = ["item1", "item2", etc]

var cells = document.getElementById("mytable").getElementsByTagName("td");
var j = 0; 
for (var i = 0; i < cells.length; i++) {
    for (j = 0; j < greencell.length; j++) {
        if (cells[i].innerHTML == greencell[j]) {
            cells[i].style.backgroundColor = "#80ff80";
        }
    }
}

如果你想为每个项目使用不同的颜色，可以使用数组:

var colors = ["#ff0000", "#00ff00", "#0000ff"];
var cells = document.getElementById("mytable").getElementsByTagName("td");
var j = 0; // You shouldn't redeclare the variable each iteration
for (var i = 0; i < cells.length; i++) {
    for (j = 0; j < greencell.length; j++) {
        if (cells[i].innerHTML == greencell[j]) {
            cells[i].style.backgroundColor = colors[j];
        }
    }
}