对Table标签内容进行增,删,查,改

1.增加内容

• (条件学号不能相同,序号不能相同,添加的值不能为空.)

1. 给一个按钮添加事件.
2. 点击该按钮获取所有的input标签
3. 通过遍历该标签来判断input的value值不能为空.为空则不能添加数据
4. 创建tr标签
5. 再次遍历input并给创建的tr标签添加值.tr.innerHTML+="<td>"+input[i].value+"</td>"
6. 可以将Table里的tr标签的下标当值给到序号即可.
7. 获取table里的tr标签,并对其进行判断,如果长度小于2则将创建的tr标签添加到Table里.如果大于2则进行学号判断.
8. 遍历table的tr标签用获取的学号的input.value和每一行tr的学号那格td.innerText转换为数字进行判断,相同则在判断里添加一个变量标记并加值.并将创建的tr标签的内容清空.
9. 判断该变量有没有值.没有则将创建的tr标签添加到Table里.

 

 

 

2.删除内容

• (在每行后面添加个删除按钮,点击删除则删除该行的所有数据)

1. 点击按钮后获取该按钮的父级tr.(event.target.parentNode.parentNode)并删除.remove();
2. 然后重新获取Table里的所有tr标签.并将其下标当值重新赋值给每一行的序号td的innerText即可

 

小白思维，有更好的做法请评论区打出来。