<script>
var div1 = document.getElementById('DIV1')
var code = '<TABLE>'
code += '<TR><TH>姓名</TH><TH>性别</TH></TR>'
code += '<TR><TD>张三</TD><TD>男</TD></TR>'
code += '<TR><TD>李三</TD><TD>女</TD></TR>'
code += '<TR><TD>王三</TD><TD>男</TD></TR>'
code += '<TR><TD>赵三</TD><TD>男</TD></TR>'
div1.innerHTML = code + '</TABLE>'
</script>
<body>
<div id='div1'></div>
</body>
但通常来说,开发者习惯动态的去添加行而非动态生成表格,因为表头基本都是固定的,每次都刷影响效率,故代码如下:
<script>
var div1 = document.getElementById('tb1')
var code = ''
code += '<TR><TD>张三</TD><TD>男</TD></TR>'
code += '<TR><TD>李三</TD><TD>女</TD></TR>'
code += '<TR><TD>王三</TD><TD>男</TD></TR>'
code += '<TR><TD>赵三</TD><TD>男</TD></TR>'
div1.innerHTML = code
</script>
<body>
<div>
<table>
<THEAD><TR><TH>姓名</TH><TH>性别</TH></TR></THEAD>
<TBODY id='tb1'></TBODY>
</table>
</div>
</body>
insertRow()函数可以带参数,形式如下: 这个函数将新行添加到index的那一行前,比如insertRow(0),是将新行添加到第一行之前,默认的insertRow()函数相当于insertRow(-1),将新行添加到表的最后。
<scriptlanguage="JavaScript">
vart=document.getElementById("test");
t.innerHTML="<tr><td>数据</td></tr>"
//或者
vart=document.getElementById("test");
vartr=document.createElement("tr");
vartd=doucment.createElement("td");
td.innerHTML="数据";
tr.appendChild(td);
t.appendChild(tr);
}
</script>
扩展资料:
给table添加一行
1、$("#addTable").click(function(){;
2、vartr="<tr>"+;
3、"<td>11</td>"+;
4、"<td>22</td>"+;
5、"<td>33</td>"+;
6、"<td>44</td>"+;
7、"<td>55</td>"+;
8、"</tr>"
9、$(".layui-table").append(tr);
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)