javascript更改动态添加的行

时间:2016-04-21 18:23:19

标签: javascript hta

我在HTA中做了一个小脚本,它从文本文件中读取信息并在屏幕上显示信息。 我有一个带标题行的表。

<table cellspacing="2" cellpadding="2" border="1" id="TablaResultados" style="font-size:10;">
  <tr bgcolor="#cd0041" align="center" style="color:white;">
    <th>Fecha</th>
    <th>Id Evento</th>
    <th>Tipo Evento</th>
    <th>Ubicacion</th>
    <th>Nombre</th>
    <th>Apellido</th>
    <th>Comentarios</th>    
  </tr>
</table>

并在此表中我动态添加了我使用javascript读取的信息行

function AgregarFila(Datos) {
  var table = document.getElementById("TablaResultados");
  var ArrDatos = Datos.split("@");
  var row = table.insertRow(1);
  var LargoArreglo = ArrDatos.length;

  for (var i = 0; i < LargoArreglo; i++){
    var cell1 = row.insertCell(i);
    cell1.innerHTML = ArrDatos[i];
    cell1.style.backgroundColor = "#99cc00"; 
  }
}

每N行我需要将行的颜色清除为白色,我正在使用此

function TablaABlanco() {
  var table = document.getElementById("TablaResultados");
  var rows = table.getElementsByTagName("tr");

  for (var i = 1; i < rows.length; i++) {
    rows[i].style.backgroundColor = "#ffffff";
  }
}

我的问题是它不会改变行的颜色。我知道函数TablaABlanco确实有效,因为如果我从零开始运行for loop,它会改变上一个表格标题的颜色。

我相信我可能需要检查其他内容以验证新行,但我一直在谷歌搜索没有运气。

1 个答案:

答案 0 :(得分:2)

问题是在AgregarFila中,您将每个单元格设置为具有背景颜色。在TablaABlanco中,您将设置为白色。单元格上的样式将优先使用并覆盖您应用于该行的样式。

因此,您不必更改每个单元格以获得背景颜色,而是在添加行时更改行的背景颜色。

function AgregarFila(Datos) {
    var table = document.getElementById("TablaResultados");
    var ArrDatos = Datos.split("@");
    var row = table.insertRow(1);
    row.style.backgroundColor = "#99cc00";

    var LargoArreglo = ArrDatos.length;
    for (var i = 0; i < LargoArreglo; i++){
        var cell1 = row.insertCell(i);
        cell1.innerHTML = ArrDatos[i];
    }
}