这个问题已经在这里有一个答案:
<div id="dataTable">
<button onclick="show()">Print data</button>
<ul id="hcplist">
</ul>
</div>
我需要遍历这个
let hcpdata = [{ "name": "David", "hcp": 54 }, { "name": "Jack", "hcp": 5 }, { "name": "Hanna", "hcp": 20 }];
使这个循环<li>
项目,并输出在<ul>
(hcplist
)没有jQuery的或其它的库 - 项目,如“大卫·54”,“杰克5”,等等。
let hcpdata = [{ "name": "David", "hcp": 54 }, { "name": "Jack", "hcp": 5 }, { "name": "Hanna", "hcp": 20 }];
function show() {
let list = document.getElementById("hcplist");
hcpdata.forEach((d) => {
let el = "<li>"+ d.name + " " + d.hcp+"</li>";
list.innerHTML += el;
});
}
<div id="dataTable">
<button onclick="show()">Print data</button>
<ul id="hcplist">
</ul>
</div>
使用此功能
function show()
{
let hcpdata = [{ "name": "David", "hcp": 54 }, { "name": "Jack", "hcp": 5 }, { "name": "Hanna", "hcp": 20 }];
let html='';
for( let i=0;hecpdata.length;i++){
html+='<li>'+hecpdata[i].name + ' ' + hecpdata[i].hcp+'</li>';
}
document.getElementById('hcplist').innerHTML=html;
}