如何往table里动态加入如下一行数据？

<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>JK:支持民族工业,尽量少买X货</title><style>
TD,INPUT{ font-size:12; }
</style>
</head><body bgcolor=EEEEEE>
<form name="frm" action="about:结果页面" method=post >
<h4 align=center>JK的动态明细示例</h4><table align="center" bordercolor=cccccc border=1  width=100% >
<tr>
<td width=500>
</td>
<td align=right>
      <input type="button"  value="增加" class="bottom" onclick="addDetailProcess();">&nbsp;     
      <input type="button"  value="删除" class="bottom" onclick="delDetailProcess();">&nbsp;     
      <input type="button"  value="完成" class="bottom" onclick="submitProcess();">
      
</td>
</tr>
</table>
<div width=100% id=thedetailtableDIV>
<table align="center" bordercolor=cccccc border=1 width=100% >
  <tr bgcolor=eeeeee id="trDetailTitles"> 
    <td ><input type=checkbox onclick="selectallcheckbox(this)"></td>
    <td >明细ID*</td>
    <td >明细NAME</td>
  </tr>
  <tbody id="tbDetailUsed" >
<tr>
<td ><input type="checkbox" name="record_select" ></td>
<td ><input type="text" name="detail_id" value='' ></td>
<td ><input type="text" name="detail_name" value='' ></td>
</tr> <tr height=0 ><td colspan=100 height=0 > 合计</td></tr>
  </tbody> </table>
</div>
</form><!--复制的内容-->
<table id="tbDetailPrepare" style="display:none">
<tr>
<td ><input type="checkbox" name="record_select" ></td>
<td ><input type="text" name="detail_id" value='' ></td>
<td ><input type="text" name="detail_name" value='' ></td>
</tr>
</table>
<input name="theHistoryRecord" type=hidden value="">
</body></html><script language=javascript> window.onload = historyOncemore;
window.onbeforeunload = fixHistory; function fixHistory() //记住历史
{
document.all("theHistoryRecord").value=document.all("thedetailtableDIV").innerHTML.replace(/\n/g,"");
} function historyOncemore() //恢复历史
{
if (document.all("theHistoryRecord").value!="")
{document.all("thedetailtableDIV").innerHTML=document.all("theHistoryRecord").value;
}
} function selectallcheckbox(obj) //全选或全不选
{
var tureorfalse=obj.checked;
var theDetail=tbDetailUsed.rows;
for(var i=0;i<theDetail.length-1;i++)
{
theDetail[i].all("record_select").checked=tureorfalse;
}
}


function addDetailProcess(afterRowIndex) //增加明细
{
var alltbDetailUsed= document.all("tbDetailUsed").rows;
var theFirstSelectedDetail;
if (afterRowIndex==null)
{
  theFirstSelectedDetail=alltbDetailUsed.length-2;
}
else theFirstSelectedDetail=afterRowIndex;
var newRow = document.all("tbDetailPrepare").rows[0].cloneNode(true);
var desRow = alltbDetailUsed[theFirstSelectedDetail+1];
desRow.parentElement.insertBefore(newRow,desRow ); }

function delDetailProcess() //删除明细
{
var alltbDetailUsed= document.all("tbDetailUsed").rows;
if (confirm("确定选择正确并且要将这些明细删除")==false) return false;
for(var i=0;i<alltbDetailUsed.length-1;i++)
{
if (alltbDetailUsed[i].all("record_select").checked==true)
{
document.all("tbDetailUsed").deleteRow(i);
i=i-1;
}
}
} function submitProcess()
{
      document.frm.submit();
}
</script>

解决方案 »

  1.   

    搞定了，查了一下msdn    var abc=document.createElement('<td></td>');
        abc.innerHTML="<input type='checkbox'>"+name;
        var ts=document.createElement('<td></td>');
        ts.innerHTML="<select><option>从小到大</option><option>从大到小</option></select>";
        tr.appendChild(ts);
        tr.appendChild(abc);
      

  2.   

    <table id="tbDetailPrepare" style="display:none">
    <tr>
    <td ><input type="checkbox" name="record_select" ></td>
    <td ><input type="text" name="detail_id" value='' ></td>
    <td ><input type="text" name="detail_name" value='' ></td>
    </tr>
    </table>
    把这一段改成你加入的行的代码就成：
    －－－＞＞＞
    <table id="tbDetailPrepare" style="display:none">
    <tr>
    <td>每次添加的内容</td>
    </tr>
    </table>
      

  3.   

    问题又来了：已经加入table的数据，怎么遍历取出来啊？我通过查tr数得到table的行数
    可是这个table里面的数据，第一个是checkbox,第二个是td,第三个是select我刚学js,希望大虾们帮帮我哦。我可以额外再加50分
      

  4.   

    以一个tr为例：<table>
    <tr id=tr1>
    <td><input type="checkbox">显示name</td>
    <td><select><option value="从小到大">从小到大</option><option value="从大到小">从大到小</option></select></td>
    </tr>
    </table>
    <input type=button value=test  onclick="alert(getVal(document.getElementById('tr1')))">
    <script>
    function getVal(trObj){
     var strVal=""
    strVal+= "是否选中："+trObj.children[0].children[0].checked 
    strVal+= "\n选项："+trObj.children[1].children[0].value
     return strVal
     }
    </script>