js添加表格内容
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>js添加表格内容</title>
</head>
<body>
姓名：<input type="text" value=""/><br>
性别：<input type="text" value=""/><br>
籍贯：<input type="text" value=""/>
<input id="btn" type="button" value="提交"/ onclick="add();">
<table border="1px" id="tablee">
<tr>
<th>姓名</th>
<th>性别</th>
<th>籍贯</th>
</tr>
<tr>
<td>陈潮男</td>
<td>男</td>
<td>中国</td>
</tr>
</table>
<script>
function add(){
var aInput = document.getElementsByTagName('input');//读取所有input形成一个数组
var table = document.getElementById("tablee");//取得表格
var oTr=document.createElement('tr');//给该表格创建tr节点
table.appendChild(oTr);//创建table的子节点tr
for(var i = 0; i < aInput.length-1; i ++){
var oTd=document.createElement('td');//创建td节点
oTd.innerHTML=aInput[i].value;//给创建的td节点赋值
oTr.appendChild(oTd);//将创建的td交给oTr节点tr
}
}
</script>
</body>
</html>2019-04-15
更多精彩
