学生后台管理系统（简易版）

Posted 13330893721zhy

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了学生后台管理系统（简易版）相关的知识，希望对你有一定的参考价值。

 <h1>学生管理</h1>
    <div>
        <label for="stuName">学生姓名：</label><input type="text" name="stuName" id="stuName">
    </div>

    <div>
        <label for="stuAge">学生年龄：</label><input type="text" name="stuAge" id="stuAge">
    </div>
    <div>
        <label for="">学生性别：</label>
        <label for="male">男</label>
        <input type="radio" name="stuGender" id="male" checked value="男">
        <label for="female">女</label>
        <input type="radio" name="stuGender" id="female"  value="女">
    </div>
    <div>
        <label for="stuScore">考试成绩：</label><input type="text" name="stuScore" id="stuScore">
    </div>
    <button type="" id="addStu">添加学生</button>
    <tr>
      
    </tr>
    <table id="stuInfo" border="1" cellspacing="0"></table>
    <script>
        let tab=document.getElementById("stuInfo");
        let addStu=document.getElementById("addStu");
        let stuName=document.getElementById("stuName");
        let stuAge=document.getElementById("stuAge");
        let stuScore=document.getElementById("stuScore");
        let stuGender=document.getElementsByName("stuGender");
        let index=null;

        let stuInfo =null;

        let render=function(stuInfo)
            tab.innerhtml="";
            if(stuInfo.length!==0)
                let thead=‘<tr><th>学生姓名</th><th>学生年龄</th><th>学生性别</th><th>考试成绩</th><th>操作</th></tr>‘;
                let tbody=‘‘;
                for(let i=0;i<stuInfo.length;i++)
                    tbody +=`<tr>
                                <td>$stuInfo[i].stuName</td>
                                <td>$stuInfo[i].stuAge</td>
                                <td>$stuInfo[i].stuGender</td>
                                <td>$stuInfo[i].stuScore</td>
                                <td><button onclick=editStu($i)>修改</button><button onclick=delStu($i)>删除</button></td>
                            </tr>`;
                
                tab.innerHTML+=thead+tbody;
            
            else
                tab.innerHTML="";
            

        


        let typeChange=function(a)
            if(Array.isArray(a))
                let obj=;
                for(let key in a)
                    obj[key]=a[key];
                
                return obj;

            
            else
                let arr=[];
                for(let key in a)
                arr[key]=a[key];
                
                return arr;
            
          
        

        window.onload=function()
            if(localStorage.stuInfo ===undefined)
                let info =
                    0:‘stuName‘:‘谢杰‘,‘stuAge‘:18,‘stuGender‘:‘男‘,‘stuScore‘:100,
                    1:‘stuName‘:‘雅静‘,‘stuAge‘:20,‘stuGender‘:‘女‘,‘stuScore‘:99,
                    2:‘stuName‘:‘希之‘,‘stuAge‘:23,‘stuGender‘:‘男‘,‘stuScore‘:89,
                
                localStorage.stuInfo=JSON.stringify(info);
                stuInfo=typeChange(info);
            
            else
                stuInfo =typeChange(JSON.parse(localStorage.stuInfo))
            
            render(stuInfo);
        


        let makeNewStu=function()
            let stuGenderValue=null;
            for(let i=0;i<stuGender.length;i++)
                if(stuGender[i].checked ===true)
                    stuGenderValue=stuGender[i].value;
                
            

            let newStu=‘stuName‘:stuName.value,‘stuAge‘:stuAge.value,‘stuGender‘:stuGenderValue,‘stuScore‘:stuScore.value
            return newStu;
        

        //添加学生
        addStu.addEventListener("click",function()
            if(addStu.innerHTML ==="添加学生")
                if(stuName.value===‘‘||stuAge.value===‘‘||stuGender===‘‘)
                    alert("信息不能为空");
                
                else
                    let newStu=makeNewStu();

                    stuInfo.push(newStu);

                    render(stuInfo);
                    localStorage.stuInfo =JSON.stringify(typeChange(stuInfo));

                    stuName.value=‘‘;
                    stuAge.value=‘‘;
                    stuGender[0].checked=true;
                    stuScore.value=‘‘;
                

            
            else
                let newInfo = makeNewStu();
                stuInfo.splice(index,1,newInfo);
                render(stuInfo);
                localStorage.stuInfo=JSON.stringify(typeChange(stuInfo));
                addStu.innerHTML=‘添加学生‘;
                stuName.value=‘‘;
                stuAge.value=‘‘;
                stuGender[0].checked=true;
                stuScore.value=‘‘;
            
        ,false);
        //删除学生
        let delStu=function(i)
            if(window.confirm(‘确认是否要删除此学生‘))
                stuInfo.splice(i,1);
                render(stuInfo);
                localStorage.stuInfo=JSON.stringify(typeChange(stuInfo));
            
        
        //修改
        let editStu=function(i)
            addStu.innerHTML=‘确认修改‘;
            stuName.value=stuInfo[i].stuName;
            stuAge.value=stuInfo[i].stuAge;
            if(stuInfo[i].stuGender===‘男‘)
                stuGender[0].checked=true;
            
            else
                stuGender[1].checked=true;
            
            stuScore.value=stuInfo.stuScore;
            index=i;
        
    </script>

 

<h1>学生管理</h1>
<div>
<label for="stuName">学生姓名：</label><input type="text" name="stuName" id="stuName">
</div>

<div>
<label for="stuAge">学生年龄：</label><input type="text" name="stuAge" id="stuAge">
</div>
<div>
<label for="">学生性别：</label>
<label for="male">男</label>
<input type="radio" name="stuGender" id="male" checked value="男">
<label for="female">女</label>
<input type="radio" name="stuGender" id="female" value="女">
</div>
<div>
<label for="stuScore">考试成绩：</label><input type="text" name="stuScore" id="stuScore">
</div>
<button type="" id="addStu">添加学生</button>
<tr>
 
</tr>
<table id="stuInfo" border="1" cellspacing="0"></table>
<script>
let tab=document.getElementById("stuInfo");
let addStu=document.getElementById("addStu");
let stuName=document.getElementById("stuName");
let stuAge=document.getElementById("stuAge");
let stuScore=document.getElementById("stuScore");
let stuGender=document.getElementsByName("stuGender");
let index=null;

let stuInfo =null;

let render=function(stuInfo)
tab.innerHTML="";
if(stuInfo.length!==0)
let thead=‘<tr><th>学生姓名</th><th>学生年龄</th><th>学生性别</th><th>考试成绩</th><th>操作</th></tr>‘;
let tbody=‘‘;
for(let i=0;i<stuInfo.length;i++)
tbody +=`<tr>
<td>$stuInfo[i].stuName</td>
<td>$stuInfo[i].stuAge</td>
<td>$stuInfo[i].stuGender</td>
<td>$stuInfo[i].stuScore</td>
<td><button onclick=editStu($i)>修改</button><button onclick=delStu($i)>删除</button></td>
</tr>`;
tab.innerHTML+=thead+tbody;
else
tab.innerHTML="";



let typeChange=function(a)
if(Array.isArray(a))
let obj=;
for(let key in a)
obj[key]=a[key];
return obj;

else
let arr=[];
for(let key in a)
arr[key]=a[key];
return arr;
 

window.onload=function()
if(localStorage.stuInfo ===undefined)
let info =
0:‘stuName‘:‘谢杰‘,‘stuAge‘:18,‘stuGender‘:‘男‘,‘stuScore‘:100,
1:‘stuName‘:‘雅静‘,‘stuAge‘:20,‘stuGender‘:‘女‘,‘stuScore‘:99,
2:‘stuName‘:‘希之‘,‘stuAge‘:23,‘stuGender‘:‘男‘,‘stuScore‘:89,
localStorage.stuInfo=JSON.stringify(info);
stuInfo=typeChange(info);
else
stuInfo =typeChange(JSON.parse(localStorage.stuInfo))
render(stuInfo);


let makeNewStu=function()
let stuGenderValue=null;
for(let i=0;i<stuGender.length;i++)
if(stuGender[i].checked ===true)
stuGenderValue=stuGender[i].value;

let newStu=‘stuName‘:stuName.value,‘stuAge‘:stuAge.value,‘stuGender‘:stuGenderValue,‘stuScore‘:stuScore.value
return newStu;

//添加学生
addStu.addEventListener("click",function()
if(addStu.innerHTML ==="添加学生")
if(stuName.value===‘‘||stuAge.value===‘‘||stuGender===‘‘)
alert("信息不能为空");
else
let newStu=makeNewStu();

stuInfo.push(newStu);

render(stuInfo);
localStorage.stuInfo =JSON.stringify(typeChange(stuInfo));

stuName.value=‘‘;
stuAge.value=‘‘;
stuGender[0].checked=true;
stuScore.value=‘‘;

else
let newInfo = makeNewStu();
stuInfo.splice(index,1,newInfo);
render(stuInfo);
localStorage.stuInfo=JSON.stringify(typeChange(stuInfo));
addStu.innerHTML=‘添加学生‘;
stuName.value=‘‘;
stuAge.value=‘‘;
stuGender[0].checked=true;
stuScore.value=‘‘;
,false);
//删除学生
let delStu=function(i)
if(window.confirm(‘确认是否要删除此学生‘))
stuInfo.splice(i,1);
render(stuInfo);
localStorage.stuInfo=JSON.stringify(typeChange(stuInfo));
//修改
let editStu=function(i)
addStu.innerHTML=‘确认修改‘;
stuName.value=stuInfo[i].stuName;
stuAge.value=stuInfo[i].stuAge;
if(stuInfo[i].stuGender===‘男‘)
stuGender[0].checked=true;
else
stuGender[1].checked=true;
stuScore.value=stuInfo.stuScore;
index=i;
</script>

以上是关于学生后台管理系统（简易版）的主要内容，如果未能解决你的问题，请参考以下文章

学生管理系统（SSM简易版）总结

Python 简易版选课系统

Android : SQLite 版学生系统

数据结构版学生管理系统

简易学生成绩管理系统

Java实现学生简易信息管理系统