使用js脚本方式在页面显示个人信息表格

在页面上使用JavaScript脚本显示个人信息表格涉及到HTML结构的创建和JavaScript的DOM操作。以下是创建一个简单的个人信息表格并使用JavaScript动态添加内容到这个表格的基本步骤：

1. 首先，你需要在HTML中创建一个表格的基本结构。这可以通过一个`<table>`元素来实现，并定义表头（`<thead>`）和表格体（`<tbody>`）。

<table id="personTable">
    <thead>
        <tr>
            <th>姓名</th>
            <th>年龄</th>
            <th>职业</th>
        </tr>
    </thead>
    <tbody>
        <!-- JavaScript将会在这里插入行 -->
    </tbody>
</table>

2. 接下来，你可以使用JavaScript来填充这个表格。你可以创建一个函数，这个函数将创建新的`<tr>`元素，并为每个个人信息创建`<td>`元素，然后将这些信息添加到表格的`<tbody>`中。

function displayPersonInfo(name, age, job) {
    var table = document.getElementById('personTable').getElementsByTagName('tbody')[0];
    var newRow = table.insertRow(); // 创建新的表格行
    var cellName = newRow.insertCell(0); // 第一列插入单元格
    var cellAge = newRow.insertCell(1); // 第二列插入单元格
    var cellJob = newRow.insertCell(2); // 第三列插入单元格

    // 添加数据到单元格
    cellName.innerHTML = name;
    cellAge.innerHTML = age;
    cellJob.innerHTML = job;
}

// 使用函数来显示个人信息
displayPersonInfo("张三", 30, "前端开发");
displayPersonInfo("李四", 25, "后端开发");

在这个例子中，`displayPersonInfo`函数接受三个参数：`name`（姓名）、`age`（年龄）和`job`（职业）。函数通过`insertRow`和`insertCell`方法创建新的行和单元格，然后使用`innerHTML`属性来填充每个单元格的数据。