姓名:
年龄:

ID Name Age 操作
1 John 19
2 Alic 20
3 Mark 21
    	var oTab = document.getElementById('tab');
        var oBtn = document.getElementById('btn');
        var oName = document.getElementById('name');
        var oAge = document.getElementById('age');
        var id = oTab.tBodies[0].rows.length+1;
		
        oBtn.onclick=function()
        {
        	//首先要添加一个 tr
            var oTr = document.createElement('tr');
            // 接下来创建三个td 
            var oTd_1=document.createElement('td');
            	//oTd13_3_1.innerHTML=oTab13_3.tBodies[0].rows.length+1;//直接行数+1,但是如果删除之后再添加,行数就会乱套
				oTd_1.innerHTML=id++; // 所以通过天剑一个变量来控制,这样添加的id就会自动增加,虽然删除之后,这个id就不再出现,但符合情况
            	oTr.appendChild(oTd_1);
                        
            var oTd_2=document.createElement('td');
				oTd_2.innerHTML=oName.value;
            	oTr.appendChild(oTd_2);
	
            var oTd_3=document.createElement('td');
            	oTd_3.innerHTML=oAge.value;
            	oTr.appendChild(oTd_3);
			// 最后一个td 里面用来放删除按钮
     		var oTd_4=document.createElement('td');
            	oTd_4.innerHTML='Delete';
            	oTr.appendChild(oTd_4);   
				
				oTd_4.getElementsByTagName('a')[0].onclick=function()
				{
					oTab.tBodies[0].removeChild(this.parentNode.parentNode);	//this 是 , 父级是td, td的父级是tr
				};
				
			        
            oTab.tBodies[0].appendChild(oTr);
            
        }