js 实现table表格添加行数据

在JavaScript中向HTML的table表格添加行数据通常涉及以下几个步骤：

1. 准备表格：首先，你需要有一个已经定义好的HTML表格结构。例如：

<table id="myTable">
    <tr>
        <th>姓名</th>
        <th>年龄</th>
        <th>职业</th>
    </tr>
    <!-- 更多行 -->
</table>

2. 使用JavaScript添加行数据：接下来，你可以使用JavaScript来动态添加新的行到这个表格中。这可以通过获取表格的引用，然后使用`insertRow()`方法来插入新行，使用`insertCell()`方法来添加单元格。

// 获取表格引用
var table = document.getElementById('myTable');

// 创建一个新行
var newRow = table.insertRow(-1);

// 向新行中添加三个单元格
var cell1 = newRow.insertCell(0);
var cell2 = newRow.insertCell(1);
var cell3 = newRow.insertCell(2);

// 为单元格赋值
cell1.innerHTML = '张三';
cell2.innerHTML = '28';
cell3.innerHTML = '软件工程师';

上面的代码会添加一行数据到表格的末尾。`insertRow(-1)`方法表示在表格的最后一行之前插入新行。`insertCell(0)`方法表示在行的第0个位置插入单元格，以此类推。

3. 动态从数据源添加数据：如果你的数据是从外部数据源来的，比如从一个数组或者JSON对象中获取数据，你可以通过循环遍历这些数据，并按照上述方法添加到表格中。