html
<table class="tab-scroll" cellpadding="0" cellspacing="0" bgcolor="">
<thead>
<tr align="center">
<th style="width: 50%;">问题名称</th>
<th style="width: 50%;">涉及用户(局)</th>
</tr>
</thead>
<tbody id="rankdetail2">
</tbody>
</table>
js动态渲染数据
方法一:
data = [
{
name: '世界你好1',
relateCustomer: '111'
},
{
name: '世界你好2',
relateCustomer: '222'
},
{
name: '世界你好3',
relateCustomer: '333'
},
{
name: '世界你好4',
relateCustomer: '444'
},
{
name: '世界你好5',
relateCustomer: '555'
},
{
name: '世界你好6',
relateCustomer: '666'
}
];
for (var i = 0; i < result.data.length; i++) {
var row = $('#rankdetail2')[0].insertRow(-1);
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
cell1.innerHTML = data[i].name;
cell1.style.textAlign = "center";
cell2.innerHTML = data[i].relateCustomer;
cell2.style.textAlign = "center";
}
方法二:
data = [
{
name: '世界你好1',
relateCustomer: '111'
},
{
name: '世界你好2',
relateCustomer: '222'
},
{
name: '世界你好3',
relateCustomer: '333'
},
{
name: '世界你好4',
relateCustomer: '444'
},
{
name: '世界你好5',
relateCustomer: '555'
},
{
name: '世界你好6',
relateCustomer: '666'
}
];
var row = document.createElement("tr");
var cell1 = document.createElement("td");
var cell2 = document.createElement("td");
cell1.innerHTML = data[i].name;
cell1.setAttribute("style", "text-align: center;"); // 设置单元格中文字居中显示
cell2.innerHTML = data[i].relateCustomer;
cell2.setAttribute("style", "text-align: center;"); // 设置单元格中文字居中显示
row.appendChild(cell1);
row.appendChild(cell2);
$('#rankdetail2')[0].appendChild(row);