如何动态插入元素到已有的table?

<table id="table1" border=1> 
<tr><td height="23"  align="left">供应商：
      <select name="gongYingShang"><option value="00">全部</option> .....</select></td>
  <td height="23"  align="left">日期从:<input name='Time' type='text' value=""></td></tr>
<tr><td height="23" align="left">指定物品：
        <select name="selectId" id="selectId" onChange="javascript:selectf(this.value, this.parentNode.parentNode.rowIndex)">
        <option value="1" >物品编号</option>
       <option value="2">物品类型</option></select></td></tr>
</table>
<SCRIPT LANGUAGE="JavaScript">
<!--
function selectf(v1,v2) {
var tr=table1.insertRow(v2+1);
var td = tr.insertCell(0);
td.setAttribute("f","true");
if (v1=='1') {
td.innerHTML = "never-online";
}
else {
td.innerHTML = "<select><option>never-online</option></select>";
}
}
//-->
</SCRIPT>

解决方案 »

  1.   

    insertRow()
    insertCell()不过ie以外就未试过
      

  2.   

    我直接在C#下写程序只要
    tablecell.contorls.add()就行了
      

  3.   

    <table id="table1" border="1"> 
    <tr>
       <td height="23" align="left">供应商：
          <select name="gongYingShang">
         <option value="00">全部</option>
      </select>
       </td>
      <td height="23" align="left">
         日期从:<input name='Time' type='text' value="">
      </td>
    </tr>
    <tr>
      <td height="23" align="left">指定物品：
            <select name="selectId" id="selectId" onChange="javascript:select(this.value)">
              <option value="1" >物品编号</option>
              <option value="2">物品类型</option>
    </select>
      </td>
    </tr>
    </table>
    <script language="javascript">
      function select(str){
        var o, newCell;
        o = document.getElementById('table1');
    if(o.rows[1].cells[1]){
      o.rows[1].cells[1].innerHTML = '';
    }
    newCell = o.rows[1].insertCell(1); 
    newCell.innerHTML = '';
        if(str == '1'){
      newCell.innerHTML += '<input type="text" value="" size="5" name="new_text">';
    }else{
      newCell.innerHTML += '<select name="gongYingShang"><option value="00">New</option></select>';
    }
      }
    </script>
      

  4.   

    可以用appendChild(oNode)，e.g:
    var oCol = document.createElement("td");
    oCol.innerHTML = "你好";
    var oRow = document.createElement("tr");
    oRow.appendChild(oCol);
    oTable.appendChild(oRow);这在IE和FireFox下都可以执行，推荐一个DOM API的地址：http://www.w3schools.com/dom/
      

  5.   

    用insertRow和insertCell都是DOM的做法，怎么这么多人都还怀疑这种方法，晕哦<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
    <HEAD>
    <TITLE> New Document - http://www.never-online.net </TITLE>
    <META NAME="Generator" CONTENT="EditPlus">
    <META NAME="Author" CONTENT="never-online, blueDestiny">
    <META NAME="Keywords" CONTENT="never-online, blueDestiny">
    <META NAME="Description" CONTENT="http://www.never-online.net">
    <style>
    body, pre
    {
    font-size: 0.9em;
    font-family: verdana;
    }
    .copyright
    {
    text-align: center;
    font-size: 1em;
    }
    </style>
    </HEAD>
    <BODY>
    <TABLE border=1 id=t>
    <TR>
    <TD>a</TD>
    </TR>
    </TABLE>
    <SCRIPT LANGUAGE="JavaScript">
    <!--
    var r=t.insertRow(1);
    r.insertCell(0).innerHTML="never-online";
    //-->
    </SCRIPT>
    <h4 class="copyright"> Power By blueDestiny, never-online, <a href="http://www.never-online.net">http://www.never-online.net</a> </h4>
    </BODY>
    </HTML>