在实际编写代码过程中,可能需要动态创建表格。

代码如下:
   [ 其他 ] 运行代码    下载代码
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="https://www.51qianduan.com/" />
<title>51前端</title>
<style type="text/css">
#theid{
  height:100px;
  border:1px solid #ccc;
  border-collapse:collapse;
}
#theid td{
  border:1px solid #ccc;
  padding:5px;
}
</style>
<script type="text/javascript"> 
window.onload=function(){
  var obt=document.getElementById("bt");
  obt.onclick=function(){
    var otable=document.createElement("table");
    otable.style.width="200px";
    otable.style.textAlign="center";
    otable.id="theid";
          
    var otr=document.createElement("tr");
    var otd=document.createElement("td");
    var otext=document.createTextNode("蚂蚁部落")
    otd.appendChild(otext);
    otr.appendChild(otd);
    otr.appendChild(otd.cloneNode());
    otable.appendChild(otr);
    otable.appendChild(otr.cloneNode());
    document.body.appendChild(otable);
  }
}
</script>
</head>
<body>
<input type="button" id="bt" value="创建表格"/>
</body>
</html>

代码描述:javascript动态创建table表格,javascript动态创建table表格代码下载



3 4



用户评论
大牛,别默默的看了,快登录帮我点评一下吧!:)      登录 | 注册


热门标签: js js代码 js实例 javascript javascript代码 javascript实例 js表格table js表格 jsTABLE javascript表格table javascript表格 javascriptTABLE

×
×

注册

官方QQ群

扫描上面二维码加微信群

官方QQ群

jQuery/js讨论群
群号:642649996
Css3+Html5讨论群
群号:322131262

加群请备注:从官网了解到