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给予与每个股票价格和变化相关的单元格（例如，对于Apple，单元格ID可以是： price_NASDAQ：AAPL，change_NASDAQ：AAPL）。然后你只需使用$（“＃price_NASDAQ：AAPL”）。html（...）来更新价格和$（“＃change_NASDAQ：AAPL”）。html（...）来更新更改。

如果您想要发生某些事情（如闪光灯），请使用$（“＃price”）。css（“background-color”，“...”）更改颜色并使用setInterval（...）在改变颜色之前等待一小段时间...

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

1 个答案: