保捱科技网

全部频道

您的当前位置：首页具体介绍JavaScript动态增删表格方法的实现

具体介绍JavaScript动态增删表格方法的实现

来源：保捱科技网
 本篇文章主要介绍了JavaScript实现动态增删表格，可以实现表格增加和删除数据的功能，非常具有实用价值，有兴趣的可以了解一下

在上方文本框填入”姓名/Email/ 年龄”，实现在下方表格中动态添加或删除单元格

效果：

1. Html代码：

<body>
<p align="center" id="info">
 姓名 : <input type="text" id = "username"> 
 Email : <input type="text" id = "email"> 
 年龄 : <input type="text" id = "age"> 
</p>

<p align="center"><input type="button" value="添加" onclick="addRow()"></p>
<hr>
<table align="center" border="1" id = "testTble" style="width: 60%;text-align: center;border:1px solid lightgreen">
 <tr>
 <td>姓名</td>
 <td>Email</td>
 <td>年龄</td>
 <td>操作</td>
 </tr>
</table>

2. JavaScript代码：

        
                
            
            
            
    
显示全文