javascript - 聊天应用程序好友存在状态 View 刷新响应设计?

标签 javascript html xhtml

在具有自定义 div 的表格单元格中显示好友在线状态的优化方式是什么?显示顺序应为在线,然后离线 friend 按字母顺序排序。

一种粗略的方法是,一旦浏览器收到基于排序数据结构的服务器响应,就发送 ajax 请求并刷新/重绘整个 friend 表(页面的其余部分除外)。但我认为还应该有一些其他更好的优化方法,可以针对特定的 div,重新排列它们或其他什么。对此方向的任何帮助表示赞赏。

最佳答案

What is the optimized way of displaying friends presence status in a table cell with custom divs?

如果你想显示好友列表,为什么不使用 UL/LI 元素而不是无意义的 DIV?

Order of display shall be Online and then Offline friends sorted alphabetically.

嗯,你可以通过使用 appendChild/insertBefore 或类似的方法(或者 jQuery 的 append/ 来重新排列现有的 DOM 元素) prepend f.e.) – 在将元素插入到目标位置之前,会自动从其当前父节点中删除该元素。

因此,将元素从元素 #online 重新分配到 #offline 会很简单 - 但由于您也想要按字母顺序排序,因此您必须弄清楚预先在之前/之后插入的元素的位置。

但是,如果这些列表不会变得太大,那么我想我宁愿避免这种情况,而是用从服务器接收到的新(排序)数据替换整个列表......因为我不确定循环遍历其他元素来找出正确排序的插入位置实际上是否比让浏览器一次性重建整个内容更便宜。

关于javascript - 聊天应用程序好友存在状态 View 刷新响应设计?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16012807/

相关文章:

javascript - 在 Javascript 中通过 onclick 事件调用的函数中使用此函数

python - 具有多行和 HTML 标签的正则表达式

jquery - Bootstrap Scrollspy - 最后一个导航项没有打开正确的位置

javascript - 不出现警报消息

html - NSXMLDocumentTidyHTML 没有清理一些 XHTML 验证错误

javascript - 学习 JavaScript 是否有必要使用 HTML 5 的所有功能?

javascript - 为什么 requestAnimationFrame 比 setInterval 或 setTimeout 更好

javascript - 如何使用 Javascript 或 JQuery 按分数、性别和姓名对排名进行排序

javascript - 如何通过单元格索引访问表格中的按钮

JavaScript 复选框更改颜色不起作用