js创建表格

由于我要从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>
发布了85 篇原创文章 · 获赞 61 · 访问量 20万+

猜你喜欢

转载自blog.csdn.net/Leo_csdn_/article/details/89518075