由于我要从django后端传递不同格式但是同名的list给前端,html本身在处理这种数据上就比较费劲,因此传入js,然后由js来创建表格,当然了,我实际项目中是由html创建表格后,js获取表格节点进行添加行列的操作,其实直接创建表格操作差不多
1.创建新表格
<script>
//创建table对象
var tab=document.createElement("table");
tab.width=500;
tab.border=1;
tab.id="tab";
var row,cell;
for(var i=0;i<3;i++){
//为表插入行
row=tab.insertRow(-1);//参数-1表示新增的行或者列是新增在最后面
for(var j=0;j<3;j++){
cell=row.insertCell(-1);
cell.innerHTML="单元格"+i+"*"+j;
}
}
document.body.appendChild(tab); //将节点添加在body内,会自动在js的插入位置创建
//document.getElementById('here').append(tab) //在指定节点添加表格
</script>
2.在原有表格基础上修改
<script>
//得到table对象
var oTable = document.getElementById("only");
//插入tr
for(var i = 0;i<3;i++)
{
var oTr = oTable.insertRow();
if (i%2 === 0)
oTr.style.backgroundColor = '#EAF2D3';
else
oTr.style.backgroundColor = '#FFFFFF';
for(var j = 0; j<3;j++)
{
//插入td
var oTd = oTr.insertCell();
//指定td内容
oTd.innerHTML = i + '*' + j;
}
}
</script>