在table中用javascript增加一行

lijun822205 2010-02-26 12:48:40

在table中用javascript增加一行，然后在增加的行里，第一列为<select>,第二列为<input type="text"> ,第三列为<input type="button">

...全文

308 11 打赏收藏转发到动态举报

写回复

用AI写文章

11 条回复

切换为时间正序

请发表友善的回复…

发表回复

lijun822205 2010-02-26

打赏
举报

那原来的不是被复盖了哦
这样差不多table.innerHmtl+=" <tr> <td> <select> </td> <td> <input type="text"> </td> <td> <input type="button"> </td> </tr>"

海子尘 2010-02-26

打赏
举报

直接innerHmtl("<tr><td><select></td><td><input type="text"></td><td><input type="button"></td></tr>")

xmliy 2010-02-26

打赏
举报

jQuery:

$('<tr><td><select /></td><td><input type="text" /></td><td><input type="button" /></td></tr>').appendTo('#tableID');

陪你在路上 2010-02-26

打赏
举报

引用 3 楼 lure2222 的回复:

HTML code<tableid="table"><tr><tdclass="tabletitle">select</td><tdclass="tabletitle">text</td><tdclass="tabletitle">button</td></tr></table><INPUTname=addrow2type=buttonvalue=增加行onclick="add(table);">?-

牛人

shan1119 2010-02-26

打赏
举报

<table id=tbl1 border=1>

</table>

<input type=button onclick="add();" value=add>

<script>

function add(){

    var tbl=document.getElementById("tbl1").childNodes[0];alert(tbl.tagName);//table的子節点tbody

    var tr=document.createElement("tr");

    var td1=document.createElement("td");

    var td2=document.createElement("td");

    var td3=document.createElement("td");

    

    td1.innerHTML="<select></select>";

    td2.innerHTML="<input type=text value=1>";

    td3.innerHTML="<input type=button>";

    tr.appendChild(td1);

    tr.appendChild(td2);

    tr.appendChild(td3);

    tbl.appendChild(tr);

}

</script>

shan1119 2010-02-26

打赏
举报

obj.childNodes[0]//table的子節点tbody

lijun822205 2010-02-26

打赏
举报

5楼的怎么和3楼的一样，不过不有注释，也挺谢谢的

lijun822205 2010-02-26

打赏
举报

4 楼的高手，请问一下obj.childNodes[0]是什么意思

Arthur0088 2010-02-26

打赏
举报



......

<script>

    function addRow() {

        // 获取table实例

         var topicsTable = document.getElementById("topicsTable");

        // 添加行

	var newTR = topicsTable.insertRow(topicsTable.rows.length);

        // 添加第一列

	var newNameTD = newTR.insertCell(0);

	newNameTD.innerHTML = "<select></select>";

        

        // 添加第二列

         var newNameTD = newTR.insertCell(1);

	newNameTD.innerHTML = "<input type='text' name='text'>";

        

        // 添加第三列

         var newNameTD = newTR.insertCell(2);

	newNameTD.innerHTML = "<input type='button' name='button'>";

    }

</script>



<table id="topicsTable" border="0" cellpadding="0" cellspacing="0">

</table>



<input type="button" value="添加一行" onclick="addRow();"/>

......

shan1119 2010-02-26

打赏
举报

<table id=tbl1 border=1>

</table>

<input type=button onclick="add();" value=add>

<script>

function add(){

    var tbl=document.getElementById("tbl1").childNodes[0];

    var tr=document.createElement("tr");

    var td1=document.createElement("td");

    var td2=document.createElement("td");

    var td3=document.createElement("td");

    

    td1.innerHTML="<select></select>";

    td2.innerHTML="<input type=text value=1>";

    td3.innerHTML="<input type=button>";

    tr.appendChild(td1);

    tr.appendChild(td2);

    tr.appendChild(td3);

    tbl.appendChild(tr);

}

</script>

lure2222 2010-02-26

打赏
举报





<table id="table">

<tr>

<td class="tabletitle">select</td>

<td class="tabletitle">text</td>

<td class="tabletitle">button</td>

</tr>

</table> 



<INPUT name=addrow2 type=button value=增加行 onclick="add(table);"> 

<script>

function add(id) 

{ 

var row = id.insertRow(id.rows.length); 

var col = row.insertCell(0);

col.innerHTML = "<select>"; 

var col = row.insertCell(1); 

col.innerHTML = "<input type='text'>"; 

col = row.insertCell(2); 

col.innerHTML = "<INPUT>"; 





} 

</script>