js遍历输出json格式数据到HTML

html-css023

js遍历输出json格式数据到HTML,第1张

$(function(){

    $.ajax({

        type:'GET',

        url:'{siteurl($siteid)}/api.php',

        dataType:'json',

        success: function(data) {

            var wrap = $("#a")

            for(var key in data) {

               wrap.append($("<li>").html(key + ': ' + data[key]))

            }

        }

    })

})

将读取到的数据用js写成表格

html部分:

<table id="table">

<tr>

<th>uid</th>

<th>uname</th>

<th>sum</th>

</tr>

</table>

js部分：

window.onload=function(){

var data=[{"uid":"2688","uname":"*江苏省南菁高级中学 022","sum":274.23},{"uid":"2689","uname":"*江阴国际会展中心管理有限公司 024","sum":0},{"uid":"2686","uname":"江苏申利实业股份有限公司 001","sum":7917.94},{"uid":"2715","uname":"江阴市吉达针纺有限公司 115","sum":41.39},{"uid":"2688","uname":"*江苏省南菁高级中学 022","sum":274.23}]

//js循环读取json数据

var table=document.getElementById("table")

for(var i=0i<data.lengthi++){

var row=table.insertRow(table.rows.length)

var c1=row.insertCell(0)

c1.innerHTML=data[i].uid

var c2=row.insertCell(1)

c2.innerHTML=data[i].uname

var c3=row.insertCell(2)

c3.innerHTML=data[i].sum

}

}