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

Question

我正在通过 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>

Answer 1

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

JQuery 具有内置的函数，用于根据您上面的元素 ID 添加和删除类。