数据渲染

<ul id="cont">
<!-- <li>让操作更简单 <span>2022-9-2</span></li> -->
</ul>
<script>
// 假设已经获取到了一组新闻数据，把数据渲染到ul中间
var list=[
{title:'新闻标题1',ctime:'2022-8-1'},
{title:'新闻标题2',ctime:'2022-8-2'},
{title:'新闻标题3',ctime:'2022-8-3'}
]
// 遍历数组，获取每个元素
// 声明变量，保存拼接这组字符串，初始值为空字符串
for(var i=0,str='';i<list.length;i++){
// console.log(list[i].title, list[i].ctime)
console.log(`<li>${list[i].title}<span>${list[i].ctime}</span></li>`)
// 把每一组拼接到str中
str+=`<li>${list[i].title}<span>${list[i].ctime}</span></li>`
}
// 循环结束后，把所有拼接到一起
// 最后再渲染到ul
cont.innerHTML=str

//显示效果