JS - 生成动态表格

<script>
        var datas = [{
            name: '卡卡西',
            subject: 'JavaScript',
            grade: 100,
        }, {
            name: '鸣人',
            subject: 'JavaScript',
            grade: 80,
        }, {
            name: '小樱',
            subject: 'JavaScript',
            grade: 100,
        }, {
            name: '鹿丸',
            subject: 'JavaScript',
            grade: 98,
        }];

        var tbd = document.querySelector('tbody');
        // 创建行
        for (var i = 0; i < datas.length; i++) {
            var tr = document.createElement('tr');
            tbd.appendChild(tr);
            // 创建列
            for (var k in datas[i]) {
                var td = document.createElement('td');
                // 调用对象里的值
                td.innerHTML = datas[i][k];
                tr.appendChild(td);
            }
            // 删除列
            var td = document.createElement('td');
            td.innerHTML = '<a href="javascript:;">删除</a>';
            tr.appendChild(td);
        }
        // 注册删除
        var as = document.querySelectorAll('a');
        for (var i = 0; i < as.length; i++) {
            as[i].onclick = function() {
                tbd.removeChild(this.parentNode.parentNode);
            }
        }
    </script>

注意：

1. 每行的数据可以放在一个对象里，几个对象放进一个数组里

2. 用createElement()创建行和列

3. 双层for循环，外层循环创建行，内层循环创建列

4. 外层是数组for(var i = 0; i < ...)内层是对象for(var k in ...)

5. 表格的内容，获取对象的属性值obj[k];

? 问题思考？删除操作在动态表格中要放在function外面，否则会自动删除一行，但是在留言案例中，要放在function里面，否则无效。？？？