找回密码
 注册
搜索
热搜: 回贴
  • 前程无忧官网首页 有什么好的平台可以
  • 最新的销售平台 互联网营销的平台有哪
  • 制作网页的基本流程 网页制作和网页设
  • 【帝国CMS】输出带序号的列表(数字排
  • 网站建设公司 三一,中联,极东泵车的
  • 织梦 建站 织梦网站模版后台怎么更改
  • 云服务官网 哪些网站有免费的简历模板
  • 如何建网站要什么条件 建网站要用什么
  • 吉林市移动公司电话 吉林省退休人员网
  • 设计类毕业论文 网站设计与实现毕业论
查看: 116|回复: 1

利用DOM生成表格的两个方法的小实验(新手可以参考)

[复制链接]
发表于 2010-1-20 04:05:43 | 显示全部楼层 |阅读模式 IP:江苏扬州
<html>
<head>
<title>Dom</title>
<meta name="Generator" content="EditPlus">
<style type="text/css">
body
{
font-size:14px;
}
</style>
<script language="JavaScript">
<!--
function CreateTable()
{
var Main = document.body;
//单元格1
var value = document.createTextNode("自动生成的单元格1");
var td = document.createElement("td");
//单元格2
var value1= document.createTextNode("自动生成的单元格2");
var td1 = document.createElement("td");
//行1
var tr = document.createElement("tr");
var tb = document.createElement("tbody");
var ta = document.createElement("table");
ta.border="0";
ta.style.backgroundColor="#ff0000";
ta.style.fontSize="14px";
ta.cellPadding="3";
ta.cellSpacing="1";
ta.width="500px";
ta.align="center";
tr.style.backgroundColor="#ffffff";
td.appendChild(value);
td1.appendChild(value1);
tr.appendChild(td);
tr.appendChild(td1)
tb.appendChild(tr);
ta.appendChild(tb);
Main.appendChild(ta);
}
function InsertInToTable()
{
var Num=parseInt(document.getElementById("Num").value);
for (var i = 1;i <= Num;i++)
{
var value = document.createTextNode("测试数据" + i);
var td = document.createElement("td");
var tr = document.createElement("tr");
var tb = document.createElement("tbody");
var ta = document.getElementById("t1");
tr.style.backgroundColor="#ffffff";
tr.style.fontSize="14px";
[知识问答ωωω.χiuGoo.сom]
td.appendChild(value);
tr.appendChild(td);
tb.appendChild(tr);
//ta.appendChild(tb); //放开这个注释,然后注释掉下面的语句,就可以在当前行的下面生成新的行
ta.insertBefore(tb,ta.firstChild); //生成新的行在当前的行的上方
}
}
//-->
</script>
</head>
<body OnLoad="CreateTable();">
<table width="500" cellspacing="1" cellpadding="3" bgcolor="#ff0000" id="t1" align="center">
<tr bgcolor="#ffffff" style="font-size:14px;">
<td>增加<input type="text" size="2" id="Num">行 <input type="button" value=" 开始 " OnClick="InsertInToTable();"></td>
</tr>
</table>
<br>
</body>
</html>
您需要登录后才可以回帖 登录 | 注册

本版积分规则

QQ|小黑屋|最新主题|手机版|微赢网络技术论坛 ( 苏ICP备08020429号 )

GMT+8, 2024-9-30 15:36 , Processed in 0.186330 second(s), 12 queries , Gzip On, MemCache On.

Powered by Discuz! X3.5

© 2001-2023 Discuz! Team.

快速回复 返回顶部 返回列表