使用id将td元素添加到tr

Question

几乎就是标题所说的.我有html documnet

<table>
  <tr>
    <td id="1"></td>
  </tr>
</table>

设置并希望<td id="2"></td>在前一个下添加一个javascript函数,所以它看起来像.

<table>
  <tr>
    <td id="1"></td>
    <td id="2"></td>
  </tr>
</table>

Answer 1

使用jquery:

$(document).ready(function(){

   $('#1').parent().append('<td id="2">2</td>');

}); 

Answer 2

insertCell()用于将新单元格插入表格行的javascript(纯)方法.

使用insertCell()在表行的末尾插入包含内容的新单元格:

var row = document.getElementsByTagName("tr")[0];
var x = row.insertCell(-1);
x.innerHTML="New cell";

尝试小提琴

你也可以使用Javascript .appendChild:

var parenttbl = document.getElementsByTagName("tr");
var newel = document.createElement('td');
var elementid = document.getElementsByTagName("td").length
newel.setAttribute('id',elementid);
newel.innerHTML = "New Inserted"
parenttbl[0].appendChild(newel);

尝试小提琴

更新:

HTML:

<table>
  <tr id="myrow">
    <td id="1">Hello</td>
  </tr>
    <tr>
    <td id="1">Hello</td>
  </tr>
    <tr>
    <td id="1">Hello</td>
  </tr>
</table>

使用Javascript:

var parenttbl = document.getElementById("myrow");
var newel = document.createElement('td');
var elementid = document.getElementsByTagName("td").length
newel.setAttribute('id',elementid);
newel.innerHTML = "New Inserted"
parenttbl.appendChild(newel);

尝试小提琴