Javascript 引导表不'；不能改变细胞的颜色

我有一个从json文件加载数据的引导表，我试图做的是，根据表中数据的值，为每个单元格着色。这些颜色在css文件中定义

我在一个非常简单的html文件上测试了这个脚本，它可以正常工作，但是尝试在引导表中使用相同的脚本，它似乎不会影响单元格的颜色。我不确定是否因为引导表有其on-css样式，它可能会影响脚本的结果

我的javascript文件color_celda.js

function colorCeldas() {


var table = document.getElementById('tablaIndicador'),
    cells = table.getElementsByTagName('td');

var val;

for (var i = 0, len = cells.length; i < len; i++) {
   val= parseInt(cells[i].innerHTML,10);

      if (val > 75 && val <= 100) { //verde

         cells[i].addClass('verdeBg ');

        } else if (val >= 50 && val <= 75) { //naranja

            cells[i].addClass('orangeBg ');

        } else if (val >= 0 && val < 50) { //rojo

            cells[i].addClass('rojoBg');

        } else  { // sin datos gris


           alert("nada");
           cells[i].addClass('grisBg ');

        }

    }

}

还有这个的javascript代码

var val;

for (var i = 0, len = cells.length; i < len; i++) {

    val = parseInt(cells[i].innerHTML,10);

       if (val > 75 && val <= 100) { //verde

         cells[i].addClass('verdeBg ');

        } else if (val >= 50 && val <= 75) { //naranja

            cells[i].addClass('orangeBg ');

        } else if (val >= 0 && val < 50) { //rojo

            cells[i].addClass('rojoBg');

        } else  { // sin datos gris

           cells[i].addClass('grisBg ');

        }

}

var；
对于（变量i=0，len=cells.length；i75&&val=50&&val=0&&val<50）{//rojo
cells[i].addClass（'rojoBg'）；
}否则{//sin datos gris
单元格[i].addClass（'grisBg'）；
}
}

addClass

不是本机DOM元素方法，这就是它失败的原因。

addClass

方法由jQuery或（在您链接到的JSFIDLE中）Mootools框架（可能还有一系列其他JS框架）提供

Mootools负责将此方法添加到元素原型中，这就是为什么它在JSFIDLE中适用于您

如果您使用的是jQuery，请执行

$（cells[i]）.addClass（className）

如果您没有使用jQuery：

var el = cells[i];
if (el.classList)
  el.classList.add(className);
else
  el.className += ' ' + className;

---

您是否使用浏览器的工具检查过文档，以查看1）类是否按预期应用，2）它们是否被其他样式声明压倒？您应该能够通过查看firebug之类的开发工具来确定引导css是否覆盖了css。它应该向您显示所有以单元格为目标的css，以及活动的css。您的css目标也可能需要调整。如果在开发工具中根本看不到单元格的css，您就会知道这一点。@lftah好的，可以了！，但对于我的原始html文件，表仍然没有更改，但对于主html文件，这似乎是因为它在表上加载json数据时，onload（）只在按F5时起作用，onchange（）根本不起作用，为了避免这种情况，我应该使用什么事件或其他选择？这值得一个新的问题。。。最好也是最简单的方法是在更新表数据后调用“updateColors”函数。另一种可能是使用

MutationObserver

观察表的更改时间。

var val;

for (var i = 0, len = cells.length; i < len; i++) {

    val = parseInt(cells[i].innerHTML,10);

       if (val > 75 && val <= 100) { //verde

         cells[i].addClass('verdeBg ');

        } else if (val >= 50 && val <= 75) { //naranja

            cells[i].addClass('orangeBg ');

        } else if (val >= 0 && val < 50) { //rojo

            cells[i].addClass('rojoBg');

        } else  { // sin datos gris

           cells[i].addClass('grisBg ');

        }

}

var el = cells[i];
if (el.classList)
  el.classList.add(className);
else
  el.className += ' ' + className;