<!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