页面中不同内容的数据获取与展示

Question

现在有默认、最新、热门三个选项，用户点击的时候内容发生改变。现在我想到两个方案

1 用户点击的时候页面刷新后台重新渲染页面

2 ajax异步获取数据前端进行渲染

如果用ajax异步加载数据的话，不用现代框架如vue anular react等也不用前端模板的情况下，如何用比较好的方式进行渲染？

举个例子比如接受到的数据是如下形式

[

 {text:"你好我想问下30岁的...",user_name:"张MOUMOU",time:"2017-10-31",listener_num:1083},

{text:"大数据方向...",user_name:"张MOUMOU1",time:"2017-1-1",listener_num:183}

]

只能用不停拼接字符串的方式吗？

var str = "";

for(var i in data) {

 str+="<div> +'data[i].text'+ </div>" 

}

$('.el').html(str)

如果数据量大的话性能会不会比较差？有没有更好的办法？

Answer 1

这种字符串拼接的方式性能很好的，或者你可以用FP优化下代码，如果交互不复杂数据变更不太频繁，这种写法没问题的