如何用js向table中写入内容

如何用js向table中写入内容,第1张

JS 语法向body中添加元素用innerHTML,下面是示例代码,供参考:

<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);


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/bake/11914620.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-19
下一篇 2023-05-19

发表评论

登录后才能评论

评论列表(0条)

保存