JavaScript 使用 insertCell 向表格行添加新单元格

作者:代码拾荒

时间:2026-10-30

浏览:145

本文介绍如何利用 JavaScript 的 insertCell 方法向指定表格行插入新单元格。通过获取行元素 ID 并调用 insertCell 指定位置,可动态修改表格结构,示例代码展示了完整的 HTML 与脚本实现。

文章目录

JavaScript 向表格行添加单元格的方法

本文介绍一种使用 JavaScript 向表格行添加新单元格的具体实现方式,供开发者参考。

以下代码演示了如何向指定 ID 的表格行中插入新的单元格。


<!DOCTYPE html>
<html>
<head>
<script>
function insCell()
{
var x=document.getElementById('tr1').insertCell(0);
x.innerHTML="The famous";
}
</script>
</head>
<body>
<table border="1">
<tr id="tr1">
<td>Peter</td>
<td>Griffin</td>
</tr>
</table>
<br>
<input type="button" onclick="insCell()" value="Insert cell">
</body>
</html>

希望上述内容对您的 JavaScript 编程有所帮助。

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章