如何用JS动态生成table标签写入到页面的DIV里
<%@PageLanguage="C#"AutoEventWireup="true"CodeBehind="WebForm1.aspx.cs"Inherits="Ultr...
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="UltraCRM_Report_Health.WebForm1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div id="DIV1">
</div>
</form>
</body>
</html>
如上：是一个新建的BS页面。
我想用js控制新增<table>标签，写到上面页面的<div>里，该如何实现？ 展开
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div id="DIV1">
</div>
</form>
</body>
</html>
如上：是一个新建的BS页面。
我想用js控制新增<table>标签，写到上面页面的<div>里，该如何实现？ 展开
3个回答
展开全部
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>
<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>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
var div = document.getElementById("stackbar");
var str = "";
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<div id="DIV1">
</div>
<script type="text/javascript">
var div = document.getElementById('DIV1');
div.innerHTML = '<table> .... </table>';
</script>
</div>
<script type="text/javascript">
var div = document.getElementById('DIV1');
div.innerHTML = '<table> .... </table>';
</script>
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（1）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
