javascript - 在 javascript 中附加到网页

Question

我想做的是:一个内容不断更新的网页。 (在我的例子中是每 2 秒更新一次)新内容附加到旧内容而不是覆盖。

这是我的代码:

var msg_list = new Array(
    "<message>Hello, Clare</message>", "<message>Hello,Lily</message>",
    "<message>Hello, Kevin</message>", "<message>Hello, Bill</message>"
);
var number = 0;
function send_msg()
{
 document.write(number + " " + msg_list[number%4]+'<br/>');
 number = number + 1;
}
var my_interval = setInterval('send_msg()', 2000); 

但是在IE和Firefox中，都只打印一行，页面不会再更新了。有趣的是，在 Chrome 中，这些行被连续打印出来，这正是我正在寻找的。

我知道根据 this link 加载页面时会调用 document.write() .所以肯定不是不断更新网页的方式。实现我想做的事情的最佳方式是什么？

完全是 Javascript 新手。谢谢。

百合花

Answer 1

我会有一个 div 或其他一些容器，如下所示:

<div id="msgDiv"></div>

然后像使用.innerHTML一样写入它，像这样:

var msg_list = new Array(
    "<message>Hello, Clare</message>", "<message>Hello,Lily</message>",
    "<message>Hello, Kevin</message>", "<message>Hello, Bill</message>"
);
var number = 0;
function send_msg()
{
    document.getElementById("msgDiv").innerHTML += number + " " + msg_list[number%4]+'<br/>';
    number++;
}
var my_interval = setInterval(send_msg, 2000); 

You can see a working example of this here