我有一个带有“更新”数组的 JSON 对象,其中每个“更新”都包含一个时间戳和一条消息:
updates : {
{
timestamp : 1329505671,
text : 'test1'
},
{
timestamp : 1329505783,
text : 'test2'
}
}
我使用 jQuery 将它们解析为 DOM 元素,并按照接收顺序将它们插入同一级别。它们是根据我在 AJAX 调用中的 SQL 查询进行预排序的。
现在,我有一个重复的 ajax 调用来检查新的更新。如果找到更新,则需要将其插入到 DOM 中的适当位置。
我不能假设这些更新将始终是列表中的最新更新,因此,我需要一种方法来找到要在哪个 DOM 更新之后插入新更新。
我曾计划创建一个 Map<int, DOMUpdate>
各种(Javascript 中的 updates[timestamp] = DOMUpdate
)。
不过,这个计划有几个缺陷:
- 我必须找到/创建一个快速的二进制搜索算法来查找 将更新放在哪个时间戳之后。
- 我不能有重复的时间戳。
所以我的问题是是否有其他人做过类似的事情,如果有,您是如何处理的?如果我有任何不清楚的地方,请告诉我。
最佳答案
只需找到第一个时间戳大于它的元素并将其附加到该元素之前。如果没有找到,则它是最新的,应根据您发布它们的顺序(最新的第一个或最后一个)附加在开始/结束处。
var appended = false;
$(collection).each(function(){
var timestamp = $(this).data("timestamp"); // replace with your code
if (timestamp < obj.timestamp) {
$(this).before(buildNewElement(obj));
appended = true;
return false;
}
});
if (!appended) {
$(collection).last().after(buildNewElement(obj));
}
显然这只是一个概念,您需要对其进行修改以符合您的代码/要求。
编辑:
如果您将数据存储在一个对象数组中,然后在收到更多对象时将对象添加到该数组,您可以根据时间戳对该数组进行排序,然后在排序后根据索引追加新对象。您必须向新收到的对象添加一个属性,然后在遍历所有对象时删除该属性,并仅附加具有该属性的对象。
关于javascript - 将元素插入 DOM,基于时间戳的位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9334074/