通过js完成员工管理系统，怎么获得管理系统里每一栏的姓名，性别，年龄，的值。
[代码内容](
员工管理系统
#title{
margin-top: 70px;
}
#system{
margin-left: 450px;
margin-top: 30px;
}
span{
border: 1px solid blue;
padding-left: 80px;
}
#addDiv{
position:absolute ;
left:450px;
bottom :100px;
display:none;
}
#updatteDiv{
position:absolute ;
left:450px;
bottom :60px;
display:none;
}
#selectDiv{
position:absolute ;
left:450px;
top :20px;
display:block;
</style>
</head>
<body>
<div>
<div id="title" align="center">
<h1>员工管理系统</h1>
<hr />
</div>
<div id="system">
<div id="header">
<span>姓名</span><span>性别</span><span>年龄</span><span>操作：</span><span><a href="#" onclick="add()">添加</a></span>
</div>
<div id="bodyer">
</div>
</div>
<div>
<div id="addDiv">
姓名：<input id="name" type="text" />
性别：<input name="sex" type="radio" value="boy" />男<input name="sex" type="radio" value="girl" />女
年龄：<input id="age" type="text" />
<input type="button" value="添加" onclick="addSub()" />
<input type="button" value="取消" onclick="cancleAdd()" />
</div>
</div>
<div>
<div id="updatteDiv">
姓名：<input id="uname" type="text" />
性别：<input name="usex" type="radio" value="boy" />男<input name="usex" type="radio" value="girl" />女
年龄：<input id="uage" type="text" />
<input type="button" value="修改" onclick="updatteSub()" id="uppdatebtn" />
<input type="button" value="取消" onclick="cancleUppdate()" />
</div>
</div>
<div>
<div id="selectDiv">
姓名：<input id="sname" type="text" />
性别：<input name="ssex" type="radio" value="boy" />男<input name="ssex" type="radio" value="girl" />女
年龄：<input id="sage" type="text" />
<input type="button" value="查找" onclick="selectDate()" id="selectbtn" />
<input type="button" value="取消" onclick="cancleSelect()" />
</div>
</div>
</div>
</body>
<script>
//定义一个数据源
var data = [];
//定义一个构造函数
var emp = function(name, sex, age) {
this.name = name;
this.age = age;
this.sex = sex;
}
//初始化数组,往里面new几个新的emp对象
function unit(num) {
for (var i = 0; i < num; i++) {
data[i] = new emp("张三" + i, "男", 24 + i);
}
}
function unitDate() {
for (var i = 0; i < data.length; i++) {
var str = "<div><span>" + data[i].name + "</span><span>" + data[i].sex + "</span><span>" + data[i].age +
"</span><span><a href='#' onclick='del(this)'>删除</a></span><span><a href='#' onclick='update(this)'>修改</a></span></div>";
system.innerHTML += str;
}
}
unit(3);
unitDate();
</script>
<script>
var system = document.getElementById("system");
var addDiv = document.getElementById("addDiv");
var updatteDiv = document.getElementById("updatteDiv");
//取消按钮可以将添加或者修改框的内容变为隐藏
function cancleUppdate() {
updatteDiv.style.display = "none";
}
function cancleAdd() {
addDiv.style.display = "none";
}
//点击添加按钮,下面出现一行添加按钮输入框
function add() {
addDiv.style.display = "block";
}
//点击下面一栏的添加按钮.可以完成内容的添加
function addSub() {
var name = document.getElementById("name").value;
var age = document.getElementById("age").value;
var sex = null;
var sexs = document.getElementsByName("sex");
for (var i = 0; i < sexs.length; i++) {
if (sexs[i].checked) {
if (sexs[i].value == "boy") {
sex = "男性";
}
if (sexs[i].value == "girl") {
sex = "女性";
}
}
}
var str = "<div><span>" + name + "</span><span>" + sex + "</span><span>" + age +
"</span><span><a href='#' onclick='del(this)'>删除</a></span><span><a href='#' onclick='update(this)'>修改</a></span></div>";
system.innerHTML += str;
}
//删除按钮,删除一整行的数据
function del(obj) {
//通过this传入obj参数获取当前对象,采用obj.parentElement获得父标签,在通过.parentElement获得整个div块,通过整个大的div删除里面的子div
system.removeChild(obj.parentElement.parentElement);
}
var spans = null;
function update(obj) {
//点击添加按钮,将添加的div显示出来
updatteDiv.style.display = "block";
//点击这个按钮可以提交更改的数据
spans = obj.parentElement.parentElement.children;
document.getElementById("uname").value = spans[0].innerText;
document.getElementById("uage").value = spans[2].innerText;
var sexs = document.getElementsByName("usex");
for (var i = 0; i < sexs.length; i++) {
if ("男性" == spans[1].innerText) {
if (sexs[i].value == "boy") {
sexs[i].checked = "checked";
}
}
if ("女性" == spans[1].innerText) {
if (sexs[i].value == "girl") {
sexs[i].checked = "checked";
}
}
}
}
function updatteSub() {
var usex = null;
var uname = document.getElementById("uname").value;
var uage = document.getElementById("uage").value;
var sexs = document.getElementsByName("usex");
for (var i = 0; i < sexs.length; i++) {
if (sexs[i].checked) {
if (sexs[i].value == "boy") {
usex = "男性";
}
if (sexs[i].value == "girl") {
usex = "女性";
}
}
}
spans[0].innerText = uname;
spans[1].innerText = usex;
spans[2].innerText = uage;
}
function selectDate() {
var sname = document.getElementById("sname").value;
var sage = document.getElementById("sage").value;
var ssex = null;
var sexs = document.getElementsByName("ssex");
for (var i = 0; i < sexs.length; i++) {
if (sexs[i].checked) {
if (sexs[i].value == "boy") {
ssex = "男性";
}
if (sexs[i].value == "girl") {
ssex = "女性";
}
}
}
//拿到员工管理系统里面所有的数据
var systemDates=document.getElementById("system").children;
//拿到员工管理系统里面的每一个span值
for(var i=0;i<systemDates.length;i++){
for(var j=0;i<systemDates[i].length;j++){
alert(systemDates[i][j]);
}
}
}
</script>
)
