我正在使用 javascript 将行附加到表中并填充来自 API 的数据，我可以让表每分钟刷新一次行

Question

我正在尝试创建每分钟刷新一次的行，我已经在 html 中创建了表格，并通过 javascript 向其添加行。 有没有办法让这些行每分钟刷新一次，而无需将更多行附加到表的底部

下面我.html文件中的表格

<table class="table table-dark" id = "statsTable">
  <thead>
    <tr>
      <th scope="col">Name</th>
      <th scope="col">Symbol</th>
      <th scope="col">Price </th>
      <th scope="col">Day High</th>
      <th scope="col">Day Low</th>
      <th scope="col">Market Cap</th>
      <th scope="col">%24h</th>
    </tr>
  </thead>
  <tbody id = "stats">
  </tbody>
</table>

下面的JavaScript

{% block jquery %}
var endpoint = '/api/table/data'
populateTable()
function populateTable(){
$.ajax({
  method: "GET",
  url: endpoint,
  success: function(data){
    console.log(data)
    var table_data ='';
    for (var key in data){
      table_data += '<tr>';
      table_data += '<td><a href = "{% url 'webapp-graph'%}"><img src="https://www.cryptocompare.com'+data[key].EUR.IMAGEURL+'"alt="'+key+'logo" style =" width:3em; height:auto;"></a></td>';
      table_data += '<td>' +key+ '</td>'
      table_data += '<td>' +data[key].EUR.PRICE+ '</td>';
      table_data += '<td>' +data[key].EUR.HIGHDAY+ '</td>';
      table_data += '<td>' +data[key].EUR.LOWDAY+ '</td>';
      table_data += '<td>' +data[key].EUR.MKTCAP+ '</td>';
      if (data[key].EUR.CHANGEPCT24HOUR[0] == '-') {
        table_data += '<td style = "color:red">' +data[key].EUR.CHANGEPCT24HOUR+ '</td>';
      } else {
        table_data += '<td style = "color:green">' +data[key].EUR.CHANGEPCT24HOUR+ '</td>';
      }
      table_data += '</tr>';
    }
    $('#stats').append(table_data);
    },
  })
}
 {% endblock %}

Answer 1

您可以使用 setTimeout 按指定的时间间隔轮询服务器。在 popualateTable 函数的末尾，您可以添加setTimeout(populateTable,1000); 有关更多信息，请参阅此帖子。

Answer 2

你可以有一个返回渲染表的 django 视图：

def some_view(request):
    data_table = get_data_table()
    return render_to_string("table.html", data_table)

并通过 ajax 调用该表单 js，结果将是您的 html 表，然后您可以在某些div中插入/替换 html。