通过对象数组环,并把它们变成LI项在UL [重复]

问题描述 投票:-9回答:2

这个问题已经在这里有一个答案:

<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”,等等。

javascript html
2个回答
-1
投票

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>

-1
投票

使用此功能

  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;
    }
© www.soinside.com 2019 - 2024. All rights reserved.