很接近原生渲染了吧!!!!!
var datas = [
{
name: ‘张三‘,
subject:‘Javascript‘,
score:100
},
{
name: ‘李四‘,
subject:‘Javascript‘,
score:98
},
{
name: ‘王五‘,
subject:‘Javascript‘,
score:80
},
{
name: ‘赵六‘,
subject:‘Javascript‘,
score:60
}
]
//往tbody里面创建行 ; 有几个人就创建几行(通过数组的长度)
var tbody = document.querySelector(‘tbody‘);
for(var i=0; i<datas.length; i++){
//创建tr行
var tr = document.createElement(‘tr‘);
tbody.appendChild(tr);
//根据对象属性的数量来创建单元格
for(var k in datas[i]){
//创建单元格
var td = document.createElement(‘td‘);
//将对象的属性值给单元格
td.innerHTML = datas[i][k]
tr.appendChild(td);
}
//创建a删除标签
var td = document.createElement(‘td‘);
td.innerHTML = "<a href=‘javascript:;‘> 删除</a>";
tr.appendChild(td)
}
var as = document.querySelectorAll(‘a‘);
for(var i=0; i<as.length; i++){
as[i].onclick = function(){
//点击a删除 所在行
tbody.removeChild(this.parentNode.parentNode)
}
}