1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="UTF-8">
5 <title></title>
6 <style type="text/css">
7
8
9 </style>
10 </head>
11 <body>
12 <div align="center" >
13 姓名:<input type="text" name="stuName" id="stuName" value="姓名" onfocus="ffocus()"/>
14 年龄:<input type="text" name="age" id="age" value="年龄" onfocus="ffocus1()"/>
15 <br /><br />
16 <input type="button" value="注册" onclick="register()"/>
17 <!--
18 作者：1767757232@qq.com
19 时间：2017-10-22
20 描述：
21
22 <input type="button" value="显示" onclick="show()" />
23 -->
24 <input type="button" value="清空" onclick="cclear()"/>
25 <div id="tip"></div>
26 <hr color="aqua"/>
27 <br />
28 <table id="tab" frame="border" width="30%" borderclorlight="aqua" border="1">
29 <tr><th>姓名</th><th>年龄</th></tr>
30
31 </table>
32 <div id="show"></div>
33 <div id="show1"></div>
34 <div id="show2"></div>
35
36 </div>
37 </body>
38 <script type="text/javascript">
39 var stuArr=new Array(3);
40 var i=0;
41 function register(){
42 var stuName=document.getElementById("stuName").value;
43 var age=document.getElementById("age").value;
44
45 var student={stuName:stuName,age:age};
46 stuArr[i]=student;
47 document.getElementById("tab").innerHTML=document.getElementById("tab").innerHTML+"<tr><td>"+stuArr[i].stuName+"</td><td>"+stuArr[i].age+"</td></tr>";
48 i++;
49 document.getElementById("tip").innerHTML="注册成功";
50
51 }
52
53 function ffocus(){
54 document.getElementById("stuName").value="";
55 document.getElementById("tip").innerHTML="";
56 }
57 function ffocus1(){
58 document.getElementById("age").value="";
59 document.getElementById("tip").innerHTML="";
60 }
61 function cclear(){
62 // stuArr.splice(0,0);
63 stuArr.splice(0,stuArr.length);
64
65 document.getElementById("tab").innerHTML="<tr><th>姓名</th><th>年龄</th></tr> ";
66
67
68 document.getElementById("tip").innerHTML="清空成功";
69
70 }
71 </script>
72 </html>
