//第一个按钮添加
function btn() {
//弹窗添加功能
var inp = '';
var user = prompt('请输入名称');
var nl = prompt('请输入年龄');
var xb = prompt('请输入性别');
var arr = [inp, user, nl, xb, '删除'];
//在tbody下添加
trvar tr = document.createElement('tr');
for(var i = 0; i < arr.length; i++) {
//创建
tdvar td = document.createElement('td');
td.innerHTML = arr[i];
tr.appendChild(td);
}
//追加
trdocument.querySelector('tbody').appendChild(tr);
}
//第二个按钮删除
function dele() {//
找到所有的input的CheckBoxvar
check = document.querySelectorAll('tbody>tr>td:first-child>input');
for(var i = 0; i < check.length; i++) {
if(check[i].checked) {
check[i].parentElement.parentElement.parentElement.removeChild(check[i].parentElement.parentElement);
}
}
}
//第三个按钮全选/全不选/反选
function qx(btn) {
//找到所有的input的CheckBoxvar
check = document.querySelectorAll('tbody>tr>td:first-child>input');
for(var i = 0; i < check.length; i++) {
if(btn.innerHTML == "全选") {
if(check[i].checked == false) {
check[i].checked = true;
}
} else if(btn.innerHTML == "全不选") {
if(check[i].checked == true) {
check[i].checked = false;
}
} else if(btn.innerHTML == "反选") {
if(check[i].checked == true) {
check[i].checked = false;
} else {check[i].checked = true;}
}
}
}
//点击每行的删除实现删除功能//事件代理/事件委托//同一个父元素下的子元素要实现的功能，要把事件同意委托给父元素执行
//ele.addEventListener('事件名'，function(){});
var tbody = document.querySelector('tbody');
tbody.addEventListener('click', function(e) {
//获取事件对象
var target = e.target;
if(target.innerHTML == '删除') {
target.parentElement.parentElement.removeChild(target.parentElement);
}
})