需求说明：
在页面上绘制一张表格，动态地向表格中添加公司员工的基本信息，测试数据不少于3 条，员工信息包括姓名、年龄、性别和部门
实现思路：
在页面中绘制表格，表头显示员工的基本信息，分别为姓名、年龄、性别和部门
在JavaScript 脚本中创建一个员工类，员工类中包含员工的属性：姓名、年龄、性别和部门
构建3 个不同的员工对象，并将它们添加到数组中
页面加载后，使用for…in 语句和with 语句遍历数组中员工对象，动态地将它们添加到表格中
实现代码：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <table border="1" id="tab"> <tr> <th>姓名</th> <th>年龄</th> <th>性别</th> <th>部门</th> </tr> </table> <script type="text/javascript"> function Employee(name,age,gender,department){ this.name=name; this.age=age; this.gender=gender; this.department=department; } var p1=new Employee("张三","25","男","人事部"); var p2=new Employee("李四","23","女","财务部"); var p3=new Employee("王五","24","女","研发部"); var arr=new Array(p1,p2,p3); function init(){ var table=document.getElementById("tab"); for (var index in arr) { var tr=document.createElement("tr"); for (var prop in arr[index]) { var td=document.createElement("td"); with (arr[index]){ if (prop=="name") { td.innerHTML=name; } if (prop=="age") { td.innerHTML=age; } if (prop=="gender") { td.innerHTML=gender; } if (prop=="department") { td.innerHTML=department; } } tr.appendChild(td); } table.appendChild(tr); } } window.onload=function(){ init(); } </script> </body> </html>
