Question

我想为我的html表替换颜色。

为了达到这个目的，我写了以下函数：

function drawColorfullShelves(){
     var table = document.getElementById("table");
     for (var i = 1, row; row = table.rows[i]; i++) {
         if( i%2 == 0){
            row[i].style.color = "rgb(200, 226, 252)";
         }else{
             row[i].style.color = "rgb(251, 251, 251)";

         }
     }

 }

但在浏览器控制台中，我看到以下内容：

未捕获的TypeError：无法读取属性＆＃39; style＆＃39;未定义的

如何解决？

Answer 1

你为什么要使用javascript？使用CSS非常简单。

tr:nth-child(odd) {
   color: rgb(251, 251, 251);
}

tr:nth-child(even) {
   color: rgb(200, 226, 252);
}

Answer 2

您的代码存在以下问题。你的循环定义了一个x行数的表，每个变量行都是table.rows [i]。这意味着在每次迭代中，您都可以将手放在行上。然后在if语句中尝试访问row [i]。这是无效的。以下是更正后的代码。

function drawColorfullShelves() {
     var table = document.getElementById("table");
     for (var i = 1, row; row = table.rows[i]; i++) {
         if( i%2 == 0) {
            row.style.color = "rgb(200, 226, 252)";
         } else {
            row.style.color = "rgb(251, 251, 251)";
         }
     }
 }

这是一个小提琴http://jsfiddle.net/2pk7uvoy/

我还必须注意javascript中的数组是基于零的。你的for循环从1开始而不是零。这是有意的吗？你想跳过第一行吗？如果没有，则下面应该是您更正后的代码。

function drawColorfullShelves() {
     var table = document.getElementById("table");
     for (var i = 0, row; row = table.rows[i]; i++) {
         if( i%2 == 0) {
            row.style.color = "rgb(200, 226, 252)";
         } else {
            row.style.color = "rgb(251, 251, 251)";
         }
     }
 }

无法读取表行的未定义属性“样式”

2 个答案: