<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> table{ border-collapse: collapse; } tr{border: 1px solid red;} td{ width: 150px; height: 30px; } </style> </head> <body> <div> <input type="button" value="删除一行" onclick="deleteRow()"/> </div> <table> <thead> <tr> <th><input type="checkbox" id="check_all" />学号</th> <th>姓名</th> <th>性别</th> </tr> </thead> <tbody id="tab_Student"></tbody> </table> <script> //控制添加行数的索引 var arr=[ [1,'张三1',"女"], [2,'张三2',"男"], [3,'张三3',"女"], [4,'张三4',"女"], [5,'张三5',"男"], [6,'张三6',"男"] ]; window.onload=function (){ var tab=document.getElementById("tab_Student"); for(i=0;i<arr.length;i++){ var tr=document.createElement("tr"); var td=document.createElement("td"); var put=document.createElement("input"); put.type="checkbox"; var checktext=document.createTextNode(arr[i][0]); td.appendChild(put); td.appendChild(checktext); tr.appendChild(td); for(j=1;j<arr[i].length;j++){ var td=document.createElement("td"); var txt=document.createTextNode(arr[i][j]); td.appendChild(txt); tr.appendChild(td); } tab.appendChild(tr); } function deleteRow(){ var input=document.getElementById("tab_Student").getElementsByTagName("input"); for(i=input.length-1;i>=0;i--){ if(input[i].type=="checkbox"&&(input[i].checked=="checked"||input[i].checked||input[i].checked=="yes")){ tab.deleteRow(i); } } } } </script> </body></html>
添加回答
举报
0/150
提交
取消