设置套接字上的文本事件

Question

我正在创建Express.js应用程序。当我从套接字获取数据时，我想在我的pug视图中设置文本。我的观点：

extends layout
block content
table.table
thead
tr
th(colspan='10').text-center #{data.title}
tr 
th #{data.label}
th Table
tbody
tr
th(scope='row') temperature [C]
td #{Number((data.t1.temperatura).toFixed(2))}
//MUCH MORE tr [...]
script(src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/3.1.3/socket.io.js")
script.
var socket = io('http://localhost:3000');
socket.on('connected', (data) => {
// fill table with data ??
});

我知道我可以用document.getElementById("td-for-x").innerHTML = data.t1.temperature;这样的东西来做这件事，但对于大表的解决方案来说，这需要做很多工作。如何做得更干净？

Answer 1

在数据项上循环，对于每个项，使用createElement和appendChild根据需要创建元素，然后将它们放入tbody 中