很接近原生渲染了吧！！！！！

Posted 2020-12-14 xu3241

 var datas = [

        {

            name: ‘张三‘,

            subject:‘javascript‘,

            score:100

        },

        {

            name: ‘李四‘,

            subject:‘Javascript‘,

            score:98

        },

        {

            name: ‘王五‘,

            subject:‘Javascript‘,

            score:80

        },

        {

            name: ‘赵六‘,

            subject:‘Javascript‘,

            score:60

        }

    ]

    

       //往tbody里面创建行 ； 有几个人就创建几行（通过数组的长度）

       var tbody = document.querySelector(‘tbody‘);

       for(var i=0; i<datas.length; i++){

           //创建tr行

           var tr = document.createElement(‘tr‘);

           tbody.appendChild(tr);

           //根据对象属性的数量来创建单元格

           for(var k in datas[i]){

               //创建单元格

               var td = document.createElement(‘td‘);

               //将对象的属性值给单元格

               td.innerhtml = datas[i][k]

               tr.appendChild(td);

           }

           //创建a删除标签

           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(){

               //点击a删除 所在行

               tbody.removeChild(this.parentNode.parentNode)

           }

       }