如何使用JavaScript表格对象对表格添加新的一行

 时间:2026-02-13 03:31:19

1、首先在记事本中输入以下代码:

<html>

<head>

</head>

<body>

<table id="myTable" border="1">

<tr>

<td>第一行1</td>

<td>第一行2</td>

</tr>

<tr>

<td>第二行1</td>

<td>第二行2</td>

</tr>

<tr>

<td>第一行1</td>

<td>第二行2</td>

</tr>

</table>

<br />

</body>

</html>

然后把文件保存为.html文件,在浏览器中打开如图

如何使用JavaScript表格对象对表格添加新的一行

2、在表格后添加一个按钮

<input type="button" value="插入行">

如何使用JavaScript表格对象对表格添加新的一行

如何使用JavaScript表格对象对表格添加新的一行

3、添加JavaScript脚本

<script type="text/javascript">

function insRow()

  {

  var x=document.getElementById('myTable').insertRow(0)

  var y=x.insertCell(0)

  var z=x.insertCell(1)

  y.innerHTML="新行1"

  z.innerHTML="新行2"

  }

</script>

并在按钮点击事件中引用;

<input type="button" onclick="insRow()" value="插入行">

如何使用JavaScript表格对象对表格添加新的一行

4、点击插入行按钮后即可在第一行进行插入,若想在别的地方插入只需要对document.getElementById('myTable').insertRow(0)中的‘’0‘进行修改。

如何使用JavaScript表格对象对表格添加新的一行

  • 如何他用powerdesigner中的SQL语句创建数据表
  • 职称计算机考试经验:Frontpage横幅广告创建
  • css如何设置文本以反方向显示
  • 如何使用HTML5+CSS3属性direction设置文本方向
  • 前端编程-用浏览器自带的取色功能快速拾取颜色
  • 热门搜索
    龟背竹的养殖方法和注意事项 奥林匹克是什么 买房需要注意什么 面试需要注意什么 北京有什么好玩的 打坐有什么好处 富含维生素c的水果 sentences是什么意思 三代还宗什么意思 扶桑花的养殖方法