求助,每点击一次Bottom按钮,添加一个表格.

<html><head><title></title>
<style type="text/css">
.s{ width :  100px; background : #CCCCFF ; height : 30px ;}
</style><script type="text/javascript">
function fn()
{
   var tr = document.createElement("tr");
   var td1 = document.createElement("td");
   td1.className="s";
   td1.innerText="1";
   var td2 = document.createElement("tr");
   td2.className="s";
   td2.innerText="2";   var object = document.getElementById("i");
   tr.appendChild("td1");
   tr.appendChild("td2");
   object.appendChild("tr");
}</script>
</head><body>
<table id="i"></table>
       <a href="" onClick="fn()">增加</a>
</body></html>

解决方案 »

  1.   

    <html><head><title></title>
    <style type="text/css">
    .s{ width :  100px; background : #CCCCFF ; height : 30px ;}
    </style><script type="text/javascript">
    function fn()
    {
      var table=document.getElementById("i");
    var row=table.insertRow(0);
    var cell1=row.insertCell(0);
    var cell2=row.insertCell(1);
    cell1.className="s";
    cell1.innerHTML="1";
    cell2.className="s";
    cell2.innerHTML="2";
    }</script>
    </head><body>
    <table id="i"><tr><td/></tr><tr><td/></tr></table>
           <a href="javascript:fn()">增加</a>
    </body></html>
      

  2.   

    tr.appendChild("td1");
      tr.appendChild("td2");
      object.appendChild("tr");
     添加的是对象  不能用双引号   onclick函数后面加上 return false
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head>
        <title>无标题页</title><style type="text/css">
    .s{ width : 100px; background : #CCCCFF ; height : 30px ;}
    </style><script type="text/javascript">
    function fn()
    {
      var tr = document.createElement("tr");
      var td1 = document.createElement("td");
      td1.className="s";
      td1.innerText="1";
      var td2 = document.createElement("td");
      td2.className="s";
      td2.innerText="2";  var object = document.getElementById("i");
      tr.appendChild(td1);
      tr.appendChild(td2);
      object.appendChild(tr);
    }</script>
    </head><body>
    <table id="i"></table>
      <a href="" onclick="fn();return false;">增加</a>
    </body>
    </html>
      

  3.   

    <head><title></title>
    <style type="text/css">
    .s{ width : 100px; background : #CCCCFF ; height : 30px ;}
    </style><script type="text/javascript">
    function fn()
    {
      var tr = document.createElement("tr");
      var td1 = document.createElement("td");
      td1.className="s";
      td1.innerText="1";
      var td2 = document.createElement("tr");
      td2.className="s";
      td2.innerText="2";  var object = document.getElementById("i");
      tr.appendChild(td1);
      tr.appendChild(td2);
      object.appendChild(tr);
      return true;
    }</script>
    </head><body>
    <table id="i"></table>
      <a href="#" onClick="fn()">增加</a>
    </body>