<div style='font-size: 30px; text-align: center;' id='tb1'>课程表</div>
<table width='800px' border='1' cellspacing='0' align='center'>
    <tr>
        <th>学号</th>
        <th>姓名</th>
        <th>分数</th>
        <th>评语</th>
    </tr>
    <tr align='center' class='data'>
        <td>001</td>
        <td>张三</td>
        <td>90</td>
        <td>很优秀</td>
    </tr>
    <tr align='center' class='data'>
        <td>002</td>
        <td>李四</td>
        <td>92</td>
        <td>优秀</td>
    </tr>
    <tr align='center' class='data'>
        <td>003</td>
        <td>王五</td>
        <td>83</td>
        <td>很努力,不错</td>
    </tr>
    <tr align='center' class='data'>
        <td>004</td>
        <td>赵六</td>
        <td>98</td>
        <td>666</td>
    </tr>
</table>
<br>
<div style='text-align: center;'>
    <input id='b1' type='button' value='改变标题内容' onclick='changeAll()'>
    <input id='b2' type='button' value='改变标题颜色' onclick='changeColor()'>
    <input id='b3' type='button' value='删除最后一行' onclick='deletTable()'>
</div>
<script>

    //3. 点击  '删除最后一行' 按钮,需要将表格中的最后一行数据删除掉,删除行可以调用tr这个DOM对象的remove()方法内容:<script>
    function deletTable() {
        var table = document.querySelector('table');
        var lastRow = table.rows[table.rows.length - 1];
        lastRow.remove();
    }
</script>
学生成绩表格 - 在线查看和操作

原文地址: https://www.cveoy.top/t/topic/qvnK 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录