在 javascript 中创建 stringbuilder 类型功能以显示聊天消息

Question

dt_msg 是一个数据表，其中我有一些聊天消息，由发送和发送。 我使用这样的字符串生成器将这些消息显示在屏幕上

stringBuilder1.Append("<div style='background-color:ALICEBLUE;float:left; width:100%; word-wrap: break-word;font-size:14px;'><pre><font color='Red'><b><div style='background-color:ALICEBLUE;word-wrap: break-word; margin-right:410px;'>" + dt_msg.Rows[i][2].ToString() + " Says: </b></font></pre></div><div style='background-color:ALICEBLUE;font-size:14px;float: left;width: 410px;margin-left: -410px; word-wrap: break-word;font-size:14px;'><pre><font>" + dt_msg.Rows[i][0].ToString() + "</font></pre></div><div style='background-color:ALICEBLUE; word-wrap: break-word;'><p style='color:#8B8A8A; margin-top:0'>Sent at " + Convert.ToDateTime(dt_msg.Rows[i][1]).ToLongTimeString() + "</p></div><div style='clear:both;'></div>")

现在我将 Ajax 与 webserices 一起使用，现在消息从 webmethod 作为字符串返回，如下所示

User1 says :~Hello to this world and enjoy this week~sent at 05:40:30 AM@#User2 says :~Hello to my world~sent at 05:41:35 AM;

它是在 ajax 代码中接收的

<script type="text/javascript">
    function OnSuccess(data) {
       if (data.d)
       {
          div1.innerText = data.d;
       }
           }
  </script>

现在 div1 显示

User1 says :~Hello to this world and enjoy this week~sent at 05:40:30 AM@#User2 says :~Hello to my world~sent at 05:41:35 AM;

但我想显示我在上一页中使用 stringBuilder 显示的消息。如何显示使用 stringBuilder 显示的字符串。这里的字符串@# 是行分隔符

Answer 1

如果您为此创建适当的结构，则不需要StringBuilder 构造，使用无序列表（ul -> 所有消息）并不断向其中添加列表项（li -> 每条消息）

var data = 'User1 says :~Hello to this world and enjoy this week~sent at 05:40:30 AM@#User2 says :~Hello to my world~sent at 05:41:35 AM';

var ul = document.getElementById('your_ul');

data.split('@#').forEach(function(d) {
    var li = document.createElement('li');
    li.innerHTML = d;
    ul.appendChild(li);
});

_{注意以上内容未经测试}

Answer 2

替换

div1.innerText = data.d;

与

div1.innerText = div1.innerText + data.d;