Javascript 从JSON创建HTML列表

我有一个对象数组：

我有一个部门：

<div class="col-lg-12" id="list-puntate">
  <!-- Insert my list here -->                              
</div>

JS

var listDiv=document.getElementById（'list-puntate'）；
var ul=document.createElement（'ul'）；
ul.appendChild（listDiv）；
对于（变量i=0；i

我希望得到这样的结果：

<div class="col-lg-12" id="list-puntate">
  <ul>
    <li>values of data.list[i].puntata</li>
    <li>...</li>
  </ul>                              
</div>

data.list[i]的值。puntata

您应该执行以下操作：

var listDiv = document.getElementById('list-puntate');
var ul=document.createElement('ul');
for (var i = 0; i < data.list.length; ++i) {
      var li=document.createElement('li');
      li.innerHTML = data.list[i].puntata;   // Use innerHTML to set the text
      ul.appendChild(li);                                 
}
listDiv.appendChild(ul);    // Note here

var listDiv=document.getElementById（'list-puntate'）；
var ul=document.createElement（'ul'）；
对于（变量i=0；i

试试这个

var listDiv = document.getElementById('list-puntate');
var ul=document.createElement('ul');
listDiv.appendChild(ul);
for (var i = 0; i < data.list.length; ++i) {

  var li=document.createElement('li');
  var textnode = document.createTextNode(data.list[i].puntata);    
  li.appendChild(textnode);
  ul.appendChild(li);                                 
}

var listDiv=document.getElementById（'list-puntate'）；
var ul=document.createElement（'ul'）；
列表div.appendChild（ul）；
对于（变量i=0；i

.appendChild（）

将

节点添加到元素中。但是
data.list[i].puntata
（在
li.appendChild（data.list[i].puntata）；
）不是
节点，而是字符串。您可以使用将字符串转换为一个节点，然后使用
.appendChild（）
添加该节点。是的，它工作得很好，但我的数组json是对数据库数据的ajax调用，我正在用数据库中的列表每秒更新我的div“list puntate”，现在我的10个项目的列表正在变为10,20,30等等。有没有办法在完成“for”循环后清除列表html？非常感谢。要删除所有
li
，只需调用
ul.innerHTML='
。
var listDiv = document.getElementById('list-puntate');
var ul=document.createElement('ul');
listDiv.appendChild(ul);
for (var i = 0; i < data.list.length; ++i) {

  var li=document.createElement('li');
  var textnode = document.createTextNode(data.list[i].puntata);    
  li.appendChild(textnode);
  ul.appendChild(li);                                 
}