![](/img/trans.png)
[英]Create stringbuilder type functionality in javascript to display chat messages
[英]javascript chat display messages
我正在尝试实现聊天。 我想在 div 中显示消息。 我的 model 看起来像:
<div id="chatcontentcontainer">
<div id="messageid">
<div class="sender">sender name</div>
<div class="messagebody">message text</div>
</div>
.....
.....
</div>
我的 javascript 看起来像:
var messages = responseXML.getElementsByTagName('ChatMessage');
var chatContainer = document.getElementById('chatcontentcontainer');
for (var i = 0; i < messages.length; i++)
{
var msg = messages[i];
var x = document.createElement('div');
x.id = msg.children[0].textContent;
x.innerHTML = msg.children[1].textContent;
chatContainer.appendChild(x);
_lastMessageId = x.id;
}
这会用没有发件人信息的消息填充 div。 一开始只有消息。 如何更改此设置以检查是否已显示消息? 您对显示消息还有其他建议吗?我对性能很感兴趣,因为这将每 5 秒刷新一次。
有没有其他方法可以选择 msg.children[0] 之类的 msg.children['Id'] 而不会影响性能?
您添加到列表中的每个 div 都需要使用数据中存在的信息进行注释。 例如,如果每个 msg 都有一个 id,你可以给 div 一个 child_id_{x} 的 id。
然后,您可以更改代码以根据 id 添加检查以确保该元素不存在。
说得通?
将时间戳或序列号与消息相关联。 从服务器返回的 XML 将有时间 t0 到时间 t1 的消息。 在页面上显示后,以某种方式将最后显示的消息的时间戳存储在浏览器中(在本例中为 t1)。 当下一组消息到达时,您只需要显示那些 id > t1 的消息。
implementation-of-running-commentary-on-any-ongoing-event是一个类似的问题,我在那里给出了端到端的解决方案策略。 您可能会发现它很有帮助。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.