我有一些在页面加载时从 Jade 加载的内容(例如,连接的用户列表)。此内容是动态的,客户端通过 socket.io 消息收到其更改的通知。客户端的 jQuery 脚本必须添加新内容或删除旧内容。
问题是新内容可能非常复杂(例如,用户的所有信息),我必须在客户端脚本中重写 HTML 代码(而 jQuery 不是为此而设计的)。
我试图克隆和编辑现有结构(可以隐藏),但我认为这不是最好的方法。
例子
服务器端
#usersList
each user in users
.userBox
.userName #{user.name}
.userCountry #{user.country}
.userMail #{user.mail}
客户端
websocket.on('newUser', function(user) {
$('<div class="userBox">'+
'<div class="userName">' + user.name +'</div>'+
'<div class="userCountry">' + user.country +'</div>'+
'<div class="userMail">' + user.mail +'</div>'+
'</div>').appendTo($('#usersList'));
});
客户端代码很糟糕。我想知道我是否可以在 Jade 中有一个内容块并执行此操作。
websocket.on('newUser', function(user) {
$(jade.userBox(user)).apprendTo('#usersList');
});
如果不可能,最好的方法是什么?