在javascript中汇总表的红色行,然后更改表

Question

我的Web应用程序收集数据:

• id(键值)

• 时间戳

• 值

然后,它创建一个这样的HTML表:

<table>
  <tr bgcolor="#FFA9A9">
    <td> ID1 </td>  
    <td> 20150619T09.43.03</td> 
    <td>VALUE1</td> 
  </tr>
  <tr>  
    <td> ID2 </td>
    <td> 20150619T09.43.02</td> 
    <td>VALUE1</td> 
  </tr>
  <tr bgcolor="#FFA9A9">  
    <td> ID3 </td>
    <td> 20150619T09.43.00</td> 
    <td>VALUE2</td> 
  </tr>
  <tr>  
    <td> ID4 </td>
    <td> 20150619T09.42.59 </td> 
    <td> VALUE1</td> 
  </tr>
  <tr bgcolor="#FFA9A9">  
    <td> ID5 </td>
    <td> 20150619T09.42.59 </td> 
    <td> VALUE2</td> 
  </tr>
  <tr>  
    <td> ID6 </td>
    <td> 20150619T09.42.58</td> 
    <td>VALUE2</td> 
  </tr>
  <tr>  
    <td> ID7 </td>
    <td> 20150619T09.42.55 </td> 
    <td> VALUE2 </td> 
  </tr>
  <tr bgcolor="#FFA9A9">  
    <td> ID8 </td>
    <td> 20150619T09.42.40 </td> 
    <td> VALUE2 </td> 
  </tr>
  <tr>  
    <td> ID9 </td>
    <td> 20150619T09.42.39 </td> 
    <td> VALUE2 </td> 
  </tr>
</table>

说明: 它按DESC顺序对时间戳值进行排序.

例如,如果t1是ID1的时间戳,'t2'是ID2的时间戳,并且......

t1 + 2 seconds >= t2

ID2行变为红色.

在我的例子中:

• ID1为红色(#FFA9A9)ID2的原因(相同值和时间戳在2秒之间)

• ID3是ID5的红色原因,是ID6的红色原因.

• ID8是ID9的红色原因

在这种情况下,ID1是副本,ID2是原始的; ID3和ID5是副本,ID6是原件; ID8是副本,ID9是它的原始版本.

我必须计算红色副本并将计数器放在原始行的另一个单元格中.

我的例子的结果应该是:

<table>
  <tr>  
    <td> ID2 </td>
    <td> 20150619T09.43.02</td> 
    <td>VALUE1</td> 
    <td>1</td>    --> one record not shown (ID1)
  </tr>

  <tr>  
    <td> ID4 </td>
    <td> 20150619T09.42.59 </td> 
    <td> VALUE1</td> 
    <td> 0 </td>
  </tr>

  <tr>  
    <td> ID6 </td>
    <td> 20150619T09.42.58</td> 
    <td>VALUE2</td> 
    <td>2</td>    --> two records not shown (ID3 and ID5)
  </tr>
  <tr>  
    <td> ID7 </td>
    <td> 20150619T09.42.55 </td> 
    <td> VALUE2 </td> 
    <td> 0 </td>
  </tr>
  <tr>  
    <td> ID9 </td>
    <td> 20150619T09.42.55 </td> 
    <td> VALUE2 </td> 
    <td> 1 </td>    --> one record not shown (ID8)
  </tr>
</table>

我需要它,因为我有3个数据收集器,我需要了解哪个事件是相同的重复...如果值相同而且时间戳在2秒之间它是同一个事件,我只需要采取表中较旧但我还需要显示存在其他捕获的副本...

有帮助吗？我可以更改类,名称或其他任何东西,但我需要在加载html页面和客户端(所以javascript或jQuery)时这样做...

我需要:

1)从头到尾逐行扫描表

2)了解它是否是红色的行

3)如果它是一个红色的行,我需要在一个不是红色且具有相同值的行之前开始计算具有相同值的红色行.然后我把计数器放在同一个不是红色排的新单元格中......

非常感谢你!!!(抱歉我的英文不好!)

Answer 1

使用 jQuery，您可以选择具有属性 bgcolor="#FFA9A9" 的所有 tr 元素，然后使用 .size() 或 .length 来获取计数。

jQuery('tr[bgcolor="#FFA9A9"]').size();

api.jquery.com/attribute-equals-selector

希望有用。

编辑：像上面一样选择红线后，您还可以.each()对选定的元素进行运行并分析它们.children()

编辑2：也许这是一个有用的方法？

trs = jQuery('tr:not[bgcolor="#FFA9A9"]');
redtrs = jQuery('tr[bgcolor="#FFA9A9"]');

for (i in trs)
{
    tds = trs.eq(i).children('td');
    for (j in redtrs)
    {
        redtds = redtrs.eq(j).children('td');
        //do your checking here
    }
}

这个想法是选择所有非红色的 tr 和所有红色的 tr。然后迭代非红色 trs 并根据红色 trs 子级 tds 检查它们的子级 tds（假设 tds 的顺序始终相同）。tds.eq(0) 是 ID，tds.eq(1) 是时间戳 tds.eq(2) 是 Value。因此，您可以比较 tds.eq(2) == redtds.eq(2) 以匹配值。当你有一个发现时，你可以增加一个计数器并最终添加第四个 td 与计数器值。尝试阅读 jQuery 选择器和 Javascript for in 循环（或者 jQuery.each，但对于初学者来说可能会更混乱）。