JS节点使用——通过js控制html中的数据信息添加、删除与编辑

最新推荐文章于 2024-05-23 08:50:15 发布

Domesteven

最新推荐文章于 2024-05-23 08:50:15 发布

阅读量1.8k

点赞数

分类专栏： HTML 文章标签： HTML 节点 js js蒙布信息添加

本文链接：https://blog.csdn.net/Domesteven/article/details/82818831

版权

本文介绍了如何利用JavaScript在HTML中实现学生信息的添加、删除和编辑功能。通过body中的元素操作，style样式调整以及script脚本实现，展示了基本的数据终端操作流程。

摘要由CSDN通过智能技术生成

HTML是我们为用户展现数据的平台，因此也少不了对数据的终端的操作，

因此，今天就做一个简单的学生信息添加、删除和编辑的功能。

具体模块以及布局如下：

具体实现：

1、body中的实现

<body>
<div id="backbg"></div>  
<div id="updatediv">
<table id="newtable" width="600px" cellpadding="0" cellspacing="0" border="1px blue solid">
	<thead>
    	<tr>
        	<td>编号</td>
            <td>姓名</td>
            <td>性别</td>
            <td>爱好</td>
            <td>年级</td>
        </tr>
    </thead>
    <tbody id="tbodynew">
    </tbody>
</table>
<button id="btn3">保存并退出</button>
<button id="btn2">退出</button>
</div>
编号：<input name="num" type="text" onblur="checkNum()" style="visibility:hidden"/><br>
姓名：<input name="name" type="text" onblur="checkName()"/><br>
性别：<input type="radio" name="sex" value="男" checked="checked"/>男
	 <input type="radio" name="sex" value="女"/>女<br>
爱好：<input name="hobi" type="checkbox" checked="checked" value="唱歌"/>唱歌
	 <input name="hobi" type="checkbox" value="跳舞" />跳