4

我想做的是:一个内容不断更新的网页。(在我的情况下是每 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 中,线条被连续打印出来,这就是我正在寻找的。

我知道根据此链接加载页面时会调用 document.write() 。所以这绝对不是不断更新网页的方式。实现我想做的最好的方法是什么?

完全是 Javascript 的新手。谢谢你。

百合

4

5 回答 5

2

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

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

然后像 using 一样写入它.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); 

你可以在这里看到一个工作示例

于 2010-04-28T22:39:20.473 回答
1

我将从查看 jQuery 库开始。这将为您节省很多痛苦。

您想要做的是将插入的行保留在表格中,例如:

$('table tbody').append('<tr><td>some value</td></tr>');
于 2010-04-28T22:39:02.070 回答
1

您可以附加到innerHTML属性:

var number = 0;
function send_msg()
{
    document.getElementById('console').innerHTML += (number + " " + msg_list[number%4]+'<br/>');
    number = number + 1;
}

此代码会将消息附加到 id 为 的元素console,例如

<div id="console"></div>

顺便说一句,setInterval用字符串调用是不好的做法。

相反,传递函数本身,如下所示:

var my_interval = setInterval(send_msg, 2000); 
于 2010-04-28T22:40:06.687 回答
1

这将是您学习一点 DOM 编程的绝佳机会。

使用 DOM 更新页面应该比简单地将更多 HTML 连接到页面中产生更少的开销。找到您想要将更新放入的节点,并在每次后续添加时执行 appendChild。

于 2010-04-28T23:09:47.847 回答
0

这个问题的答案可能会有所帮助: 什么是网络化我的命令行守护程​​序的简单方法?

于 2010-04-28T22:35:49.203 回答