当一个数据表单元格的值发生变化时,如何更改该值的颜色

时间:2019-08-01 19:36:45

标签: javascript jquery html css datatables

我正在通过ajax为我的数据表获取json数据,并每2秒执行一次ajax重载,这会更新数据表值,但是我想更改在重载期间更改的所有值的颜色。我该怎么办?

我希望输出是这样的 https://www.dailyfx.com/forex-rates?ref=TopRates

这是我的代码

<table id="example" class="pgnTable table" style="width:100%">
  <thead>
    <tr>
      <th>First value</th>
      <th>Second value</th>
      <th>Third value</th>
      <th>Fourth value</th>
    </tr>
  </thead>
</table>
<script>
  $(document).ready(function() {
    $('#example').DataTable({
      "ajax": {
        "url": "/pktd",
        "dataType": "json",
        "dataSrc": "data",
        "contentType": "application/json"
      },
      "columns": [{
          "data": "first"
        },
        {
          "data": "second"
        },
        {
          "data": "third"
        },
        {
          "data": "fourth"
        }
      ]
    });
    setInterval(function() {
      $('#example').DataTable().ajax.reload();
    }, 2000);
  });
</script>

1 个答案:

答案 0 :(得分:2)

您可以在看到值更改时设置CSS类,使用CSS Keyframes还可以添加一些颜色变化的动画,例如外汇网站。

JQuery具有内置的功能,用于像上面一样基于元素ID添加和删除类。