基于node.js服务器setTimeout()更改html文本

时间:2014-06-01 07:36:25

标签: javascript node.js socket.io

如何使用node.js和setTimeout函数在一段时间后将div的文本更改为另一个文本字符串?

主要警告是应该同时为所有用户更改文本。

假设索引页面上的h2标题最初会显示“欢迎使用此页面”。

5秒后(在服务器之后,而不是在请求之后),该h2标题应更改为“让我们开始。”

如果在服务器启动后6秒内发出另一个请求,他们应该会看到“让我们开始吧”。并且永远不会看到“欢迎来到此页面”。因为h2标题应该普遍改变。

非常感谢任何指导。

1 个答案:

答案 0 :(得分:3)

以下是您可以尝试的内容(Express + SocketIO 1.0示例):

<强> server.js:

var app    = require('express')();
var server = require('http').createServer(app);
var io     = require('socket.io')(server);

server.listen(80);

var dir = __dirname;

app.get('/', function(req, res) {
    res.sendfile(dir + '/index.html');
});

var header = 'Welcome to this page.';
setTimeout(function() {
    header = 'Let\'s get started.';
    io.emit('change_header', {
        header: header
    });
}, 5000);

io.on('connection', function(socket) {
    socket.emit('change_header', {
        header: header
    });
});

<强>的index.html:

<!DOCTYPE html>
<html>
<head>
<script src="/socket.io/socket.io.js"></script>
<script>
document.addEventListener('DOMContentLoaded', function() {
    var socket = io();
    socket.on('change_header', function(data) {
        document.getElementById('header').innerHTML = data.header;
    });
});
</script>
</head>
<body>

    <h2 id="header"></h2>

</body>
</html>