javascript中table的创建

袁梦希

本帖最后由张龙欢于 2013-6-8 11:35 编辑

我下面代码的功能主要是想实现，当我文本框输入行数和列数时，一点击按钮就可以创建相对应的表格来！但是主要的问题是，点了之后创建不了。

<meta http-equiv="Content-Type" content="text/html; charset=GB18030">
<title>Insert title here</title>
<script type="text/javascript">
function chuangjian(){
var row=document.getElementById("crow").value; //获取行数
var lie=document.getElementById("clie").value; //获取列数
var table = document.createElement("table");
for (var x=1;x<=row;x++){
var tr=document.creatElement("tr");
table.appendChild(tr);
for (var y=1;y<=lie;y++){
var td=document.createElement("td");
td.innerHTML=x+","+y;
tr.appendChild(td);
}
}
document.body.appendChild(table); //把表格添加到body中
}
</script>
</head>
<body>
创建的行数：<input type="text" style="width:30xp" id="crow"><br />
<br />
<br />
创建的列数：<input type="text" style="width:30xp" id="clie">
<br/>
<input type="button" value="创建" onclick="chuangjian()">
<br />
<br />
</body>
</html>

复制代码

秦兰之 · 秦兰之

本帖最后由秦兰之于 2013-6-8 02:59 编辑

我是在DW4里测试的。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<meta http-equiv="Content-Type" content="text/html; charset=GB18030">
<title>Insert title here</title>
<script type="text/javascript">

function chuangjian()
{
      var row=document.getElementById("crow").value; //获取行数
      var lie=document.getElementById("clie").value; //获取列数

      var table = document.createElement("table");

      for (var x=1;x<=row;x++)
      {
            //var tr=document.creatElement("tr");//注释了这行，虽然看上去是一样的，creatElement少了个e 。
            var tr=document.createElement("tr");

            table.appendChild(tr);

            for (var y=1;y<=lie;y++)
            {
                     var td=document.createElement("td");
                     td.innerHTML=x+","+y;
                     tr.appendChild(td);
            }
      }
      document.body.appendChild(table); //把表格添加到body中
}
</script>

</head>
<body>
      创建的行数：<input type="text" style="width:30xp" id="crow"><br />
<br />

<br />
      创建的列数：<input type="text" style="width:30xp" id="clie">
<br/>

<input type="button" value="创建">
<br />
<br />

</body>
</html>

黑马云青年给您回复。

张龙欢 · 张龙欢

秦兰之发表于 2013-6-8 02:40
我是在DW4里测试的。

谢谢！！！！

秦兰之 · 秦兰之

解决了就把问题改为已解决。

帐号		自动登录	找回密码
密码			加入黑马

javascript中table的创建

评分

4 个回复