<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<script>
window.onload=function(){
var oTab=document.getElementById('tab');
var oName=document.getElementById('name');
var oAge=document.getElementById('age');
var oBtn=document.getElementById('btn');
oBtn.onclick=function(){
var oTr=document.createElement('tr');
var oTd=document.createElement('td');
oTd.innerHTML=oTab.tBodies[0].rows.length+1;
oTr.appendChild(oTd);
// 添加姓名
var oTd=document.createElement('td');
oTd.innerHTML=oName.value;
oTr.appendChild(oTd);
// 添加年龄
var oTd=document.createElement('td');
oTd.innerHTML=oAge.value;
oTr.appendChild(oTd);
oTab.tBodies[0].appendChild(oTr);
}
}
</script>
<body>
姓名:<input type="text" id="name" />
年龄:<input type="text" id="age" />
<button id="btn">添加</button>
<table width="500px" id="tab" border="1">
<thead>
<tr>
<th>id</th>
<th>姓名</th>
<th>年龄</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</body>
</html>
table添加内容
最新推荐文章于 2023-05-26 18:08:02 发布