html动态创建table不成功的一个问题

看下面代码，第二个(addTable())可以在testDiv里创建一个表格，但是add()就不行。

网友的解释是：
给表格添加 行 和 单元格时候
尽量用 table对象自己的 方法添加

function add()
        {
            var table = document.createElement("table");
            table.name = "mytable";
            table.width="200px";
            
            
            var tr =document.createElement('tr');
            var td1=document.createElement('td');
            var td2=document.createElement('td');
            td1.appendChild(document.createTextNode("第一格"));                
            td2.appendChild(document.createTextNode("第二格"));
            tr.appendChild(td1);
            tr.appendChild(td2);
            
            testDiv.appendChild(tr);
            table.appendChild(tr);
                        
            testDiv.appendChild(table);            
        }
        
        function addTable()
        {
            var ta1=document.createElement("table"); 
            ta1.style.border="1";             

            for(var i = 0;i < 10;i ++)
            {
                var txtNode1=document.createTextNode("第" + i + "条");
                ta1.insertRow(); 
                ta1.rows[i].insertCell(); 
                ta1.rows[i].cells[0].appendChild(txtNode1);                             
            }
            
            testDiv.appendChild(ta1);
        }

<div id="testDiv">
        
        </div>