JS對象簡單操作
實現的功能：
在輸入框中輸入信息，添加到表格中
實現效果如圖所示：
代碼實現如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body align="center">
<h1 style="color: lightsalmon">請添加聯繫人信息：</h1>
<hr>
<div class="div">
姓名：<input type="text" value="">
聯繫方式：<input type="text" value="">
年齡：<input type="text" value="">
<input type="button" value="添加用戶" onclick="add_p()">
</div>
<div id="div" align="center"></div>
</body>
<script>
var array=new Array();
function add_p(){//添加用戶
var inp=document.getElementsByTagName("input");
var p= {
name:inp[0].value,
news:inp[1].value,
age:inp[2].value
};
array.push(p);
look_p();
}
function look_p(){//查看（顯示）用戶
var str="";
str+="<hr>" +
"<table border='2'>" +
"<tr>" +
"<td width='150'>姓名</td>" +
"<td width='150'>聯繫方式</td>" +
"<td width='150'>年齡</td>" +
"<td width='80'>操作</td>" +
"</tr>";
for(var i=0;i<array.length;i++){
str+="<tr>" +
"<td>"+array[i].name+"</td>" +
"<td>"+array[i].news+"</td>" +
"<td>"+array[i].age+"</td>" +
"<td><input type='button' value='刪除' onclick='del_p("+i+")'></td>" +
"</tr>";
}
str+="</table>";
var s=document.getElementById("div");
s.innerHTML=str;
}
function del_p(num){
array.splice(num,1);
look_p();
}
</script>
</html>