如何用js在指定tr后添加tr

如何用js在指定tr后添加tr,第1张

你可以用js原生的append或是insertBefore。

下面是简单的例子:

<body>

<table id="tab">

     <tr>

         <td>1111</td>

            <td>1111</td>

        </tr>

    </table>

</body>

<script>

var oTab = document.getElementById('tab')

var oTr = document.createElement('tr')     //创建TR

oTr.innerHTML='<td>22222</td><td>22222</td>' //TR里面加2个TD

oTab.appendChild(oTr)

</script>

insertRow()函数可以带参数,形式如下:这个函数将新行添加到index的那一行前,比如insertRow(0),是将新行添加到第一行之前,默认的insertRow()函数相当于insertRow(-1),将新行添加到表的最后。

<scriptlanguage="JavaScript">

vart=document.getElementById("test");

t.innerHTML="<tr><td>数据</td></tr>"

//或者

vart=document.getElementById("test");

vartr=document.createElement("tr");

vartd=doucment.createElement("td");

td.innerHTML="数据";

tr.appendChild(td);

t.appendChild(tr);

</script>

扩展资料:

给table添加一行

1、$("#addTable").click(function(){;

2、vartr="<tr>"+;

3、"<td>11</td>"+;

4、"<td>22</td>"+;

5、"<td>33</td>"+;

6、"<td>44</td>"+;

7、"<td>55</td>"+;

8、"</tr>"

9、$(".layui-table").append(tr);

function onAddTR(trIndex)

{

var tb = document.getElementById("tb1")

var newTr = tb.insertRow(trIndex)//添加新行,trIndex就是要添加的位置

var newTd1 = newTr.insertCell()

newTd1.innerHTML = "这是新行,位置:" + trIndex

var newTd2 = newTr.insertCell()

newTd2.innerHTML = "这是新行,位置:" + trIndex

}

或是直接用jq来写,会更简单

function onAddTR(trObj)

{

$(trObj).after("<tr onclick='onAddTR(this)'><td>这是新行</td><td></td><tr/>")

}


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/bake/11428121.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-16
下一篇 2023-05-16

发表评论

登录后才能评论

评论列表(0条)

保存