重新加载或刷新JSON和HTML加载顺序

Question

我正在尝试创建一些代码，这将允许我为我正在构建的智能镜像项目提取和显示股票数据。

我已经得到它显示所有的信息，但无法更新股票数据。我希望它每5秒更新一次信息，但是当我这样做的时候，它基本上是重复的，并且继续一遍又一遍地输出所有的库存，从页面上。

如何使它在不重新加载整个页面的情况下重新加载数据，以及如何判断它是否正常工作？是否可以添加一个css元素，在价格变化时将价格显示为黄色？

下面是我的小提琴代码：https://fiddle.jshell.net/Aurum115/2kbpt91z/17/

编辑:澄清第二部分。我基本上还是想保存旧的价格，并比较它与新的价格，暂时和快速闪现文字黄色，如果它已经改变。

Answer 1

您遇到的问题是，您正在将新的HTML附加到现有的HTML中。

要解决问题，需要删除正在更新的div的现有内容。您应该在setInterval(，，行)之后添加以下代码：

$("#title").html("");
$("#livePrice").html("");
$("#stockTicker").html("");
$("#livePercent").html("");
$("#liveData").html("");

不幸的是，每次重新加载时，它都会导致“闪烁”。为了减少这种情况，在有固定行数的情况下，可以标记每一行1-X (并对每行中的单元格使用相同的编号)，然后在更新时简单地覆盖每一行上每个单元格的内容.

在我看来，如果您不担心股票出现的顺序，您应该使用一个表，并给出与每个股票价格和变化相关的单元格的id(例如，对于苹果来说，单元id可以是: price_NASDAQ:AAPL、change_NASDAQ:AAPL)。然后您只需使用$(“#price_NASDAQ:AAPL”).html(.)更新价格和$(“#change_NASDAQ:AAPL”).html(.)更新更改。

如果你想要发生什么事情(比如闪光灯)，使用$(“#price”).css(“背景颜色”，“.”)更改颜色并使用setInterval(.)等一小会儿再换回颜色..。