22-作业一：JS实现网页表格的增删改功能

22-作业一：JS实现网页表格的增删改功能

css文件(花里胡哨的样式，可以选做)

main.css

body{
    margin:0px;
    background-size:100% 100%;
    background-attachment:fixed;
    opacity: 0.8;
    background-color: aliceblue;
    top: auto;
}
table{
    margin-right: auto;
    margin-left: auto;
    margin-top: auto;
    border:"1";
    cellspacing:"0";
    cellpadding:"0";
    id:"listTable";
}

js文件夹（让页面动起来的东东，增删改操作）

js.js

window.onload = function() {
	var submits = document.getElementById("submit");
	//获取焦点
	document.getElementById('user').focus();
	document.getElementById('user').select();
	//增加
	submits.onclick = function() {
		//获取用户姓名
		var user = document.getElementById("user").value;
		//获取学号（密码）
		var password = document.getElementById("password").value;
		//获取学院
		var place = document.getElementById("place");
		//获取索引
		var index = place.selectedIndex;
		//获取选中值
		var placeValue = place.options[index].text;
		//获取性别
		var interests = document.getElementsByName("interest");
		//获取value值
		var selectValue="";
		for(var i = 0; i < interests.length; i++) {
			var interest = interests[i];
			if(interest.checked==true) {
				selectValue=selectValue+interest.value+",";
			}
		}
		//获取文本值
		var selectedValue="";
		for(var i=0;i<interests.length;i++){
			if(interests[i].checked){
//			nextSibling是获得当前对象的下一个对象
//			nodeValue是返回一个节点的值
				selectedValue=selectedValue+interests[i].value+" ";
//				selectedValue=selectedValue+interests[i].nextSibling.nodeValue;
			}
		}
		selectedValue=selectedValue.replace(/(\s*$)/g, "");
		var radioValue="";
		var identitys=document.getElementsByName("identity");
		for(var i=0;i<identitys.length;i++){
			if(identitys[i].checked){
				radioValue=radioValue+identitys[i].nextSibling.nodeValue;
			}
		}
		//增加
		add(user,password,placeValue,selectedValue,radioValue);
	}
	
	//重置
	document.getElementById('reset').onclick=function(){
		resets();
	};
	
	function add(user,password,placeValue,selectedValue,radioValue){
		//创建一个框架节点
		var tr =document.createElement("tr");
		var td1 =document.createElement("td");
		var td2 =document.createElement("td");
		var td3 =document.createElement("td");
		var td4 =document.createElement("td");
		var td5 =document.createElement("td