如何用JS动态生成table标签写入到页面的DIV里
发布网友
发布时间:2022-05-05 18:51
我来回答
共3个回答
热心网友
时间:2022-04-21 12:27
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>
热心网友
时间:2022-04-21 13:45
var div = document.getElementById("stackbar");
var str = "";
热心网友
时间:2022-04-21 15:20
<div id="DIV1">
</div>
<script type="text/javascript">
var div = document.getElementById('DIV1');
div.innerHTML = '<table> .... </table>';
</script>