原生JavaScript动态生成表格的方法

原生js 专栏收录该内容
2 篇文章 0 订阅

原生js动态生成表格

给定一个二维数组 自动生成一个带序号的表格

不明白的欢迎评论,再交流
function innerlist(arrs){
	var tr1 = '';
	var tr2 = '';
	var td = '';
	var ove="";
	var num = 0;
	var arr = new Array();
	for(i=0; i<arrs.length;i++){
	//这边做了判断主要是想让单双不同的 tr 有着不同的css样式(比如隔一行慌一种背景颜色)
		if (i%2==0){
			tr1='<tr class = "row row1">';
			}
		else{
			tr1='<tr class = "row row2">';
		}
		// 这边主要是为了在要生成的表格的前一列生成一列序号,当然也可以在前面加复选框等等
		num++;
			td += '<td>'+num+'</td>';
		for(j=0; j<arrs[i].length;j++){
			td += '<td>'+arrs[i][j]+'</td>';
		}
		ove += tr1+td+'</tr>';
		td='';
		}
		将组合起来的表格返回出去  扔到tbody里面即可
	return ove
}

效果图如下:
在这里插入图片描述

  • 1
    点赞
  • 0
    评论
  • 1
    收藏
  • 一键三连
    一键三连
  • 扫一扫,分享海报

©️2021 CSDN 皮肤主题: 数字20 设计师:CSDN官方博客 返回首页
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值